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

package/dist/components/select/select.template.js

@@ -0,0 +1,216 @@
+import { bind } from "../../adapter/template/types.js";
+import { ownerAttributes } from "../../adapter/template/owner.js";
+import { lend, lendBefore, lendMark } from "../../adapter/template/lend.js";
+import { createDetail, patch } from "../../adapter/template/parts.js";
+import "../../adapter/index.js";
+import { TIconElement } from "../icon/Icon.element.js";
+import "../icon/index.js";
+import { TInputElement } from "../input/Input.element.js";
+import "../input/index.js";
+import { TFrameElement } from "../frame/Frame.element.js";
+import "../frame/index.js";
+import { TDrawnRows } from "../common/drawn-rows.js";
+import { TTagsElement } from "../tags/Tags.element.js";
+import "../tags/index.js";
+import { TSelectGroupElement } from "./group/SelectGroup.element.js";
+import "./group/index.js";
+import { TSelectItemElement } from "./item/SelectItem.element.js";
+import "./item/index.js";
+import { DEFAULT_SLOT } from "@soxa-ui/setup";
+//#region src/components/select/select.template.ts
+/** Слот Select → слот опции из данных; сверяет `setup/__tests__/item-slots.spec.ts`. */
+var SELECT_ITEM_SLOTS = {
+	"item-leading": "leading",
+	item: "default",
+	"item-trailing": "trailing",
+	"item-indicator-icon": "indicator-icon"
+};
+var ROWS = {
+	block: "select",
+	item: TSelectItemElement,
+	group: TSelectGroupElement,
+	slots: SELECT_ITEM_SLOTS
+};
+var parts = /* @__PURE__ */ new WeakMap();
+var fieldTags = /* @__PURE__ */ new WeakMap();
+/**
+* Экземпляр сменился — новая деталь: Select заводит его на каждый переход в
+* `multiple`, а связка без движка снаружи — на каждое подключение.
+*/
+function drawTags(ctx, own) {
+	const tags = ctx.state.tags ?? null;
+	const drawn = fieldTags.get(ctx.root);
+	if (drawn?.ctrl === tags) return;
+	drawn?.node.remove();
+	fieldTags.delete(ctx.root);
+	if (!tags) return;
+	const node = createDetail(ctx.root.ownerDocument, TTagsElement, { embedded: "select.tags" });
+	node.className = "so-select__tags";
+	node.ctrl = tags;
+	node.engine = ctx.state.tags_engine ?? void 0;
+	lendBefore(own.mark, node);
+	fieldTags.set(ctx.root, {
+		node,
+		ctrl: tags
+	});
+}
+var selectTemplate = {
+	create: (root, { hasSlot }) => {
+		const { ownerDocument } = root;
+		const field = createDetail(ownerDocument, TInputElement, { embedded: "select.field" });
+		const box = ownerDocument.createElement("span");
+		const panel = createDetail(ownerDocument, TFrameElement, { embedded: "select.frame" });
+		const handle = ownerDocument.createElement("div");
+		const list = ownerDocument.createElement("div");
+		const end = ownerDocument.createComment("");
+		field.className = "so-select__field";
+		box.className = "so-select__arrow";
+		panel.className = "so-select__panel";
+		panel.strategy = "fixed";
+		panel.anchor_anchor = root;
+		panel.anchor_offset = 4;
+		handle.className = "so-select__handle";
+		handle.setAttribute("aria-hidden", "true");
+		list.className = "so-select__list";
+		list.appendChild(end);
+		const mark = lendMark(field, "leading");
+		let arrow = null;
+		if (!hasSlot("arrow-icon")) {
+			arrow = createDetail(ownerDocument, TIconElement, { embedded: "select.arrow" });
+			arrow.icon = "arrowDown";
+			box.appendChild(arrow);
+		}
+		lend(field, "trailing", box);
+		lend(panel, DEFAULT_SLOT, list);
+		if (!hasSlot("field")) root.appendChild(field);
+		root.appendChild(panel);
+		const rows = hasSlot(DEFAULT_SLOT) ? null : new TDrawnRows(list, end, ROWS);
+		parts.set(root, {
+			field,
+			mark,
+			arrow,
+			panel,
+			handle,
+			list,
+			rows
+		});
+		return {
+			slots: {
+				field: {
+					mode: "before",
+					node: panel
+				},
+				tags: {
+					mode: "before",
+					node: mark,
+					slot: "leading"
+				},
+				leading: {
+					mode: "append",
+					node: field,
+					slot: "leading"
+				},
+				clear: {
+					mode: "append",
+					node: field,
+					slot: "clear"
+				},
+				"arrow-icon": {
+					mode: "append",
+					node: box
+				},
+				trailing: {
+					mode: "append",
+					node: field,
+					slot: "trailing"
+				},
+				default: {
+					mode: "before",
+					node: end
+				},
+				empty: {
+					mode: "before",
+					node: end
+				},
+				item: { mode: "sample" },
+				"item-leading": { mode: "sample" },
+				"item-trailing": { mode: "sample" },
+				"item-indicator-icon": { mode: "sample" }
+			},
+			control: field
+		};
+	},
+	bindings: [
+		bind([], ({ root, ctrl }) => {
+			const field = parts.get(root)?.field;
+			if (field && ctrl && field.ctrl !== ctrl.field) field.ctrl = ctrl.field;
+		}),
+		bind("id", ({ root, state }) => {
+			const field = parts.get(root)?.field;
+			if (field) field.id = state.id ?? "";
+		}),
+		bind("aria", ({ root, state }) => {
+			const field = parts.get(root)?.field;
+			if (field) ownerAttributes(field, state.aria);
+		}),
+		bind("size", ({ root, state }) => {
+			const arrow = parts.get(root)?.arrow;
+			if (arrow && arrow.size !== state.size) arrow.size = state.size;
+		}),
+		bind(["tags", "tags_engine"], (ctx) => {
+			const own = parts.get(ctx.root);
+			ctx.showSlot("tags", (ctx.state.tags ?? null) !== null);
+			if (own && !ctx.hasSlot("tags")) drawTags(ctx, own);
+		}),
+		bind([
+			"open",
+			"panelPlacement",
+			"panelFlip",
+			"autoFitWidth",
+			"visible"
+		], ({ root, state }) => {
+			const panel = parts.get(root)?.panel;
+			if (!panel) return;
+			const visible = state.visible === true && state.open === true;
+			const flip = state.panelFlip === true;
+			const matchWidth = state.autoFitWidth === true;
+			patch(panel, {
+				visible,
+				anchor_placement: state.panelPlacement,
+				anchor_flip: flip,
+				anchor_matchWidth: matchWidth
+			});
+		}),
+		bind(["panelDataset", "dismiss_ownerAttribute"], ({ root, state }) => {
+			const panel = parts.get(root)?.panel;
+			if (panel) ownerAttributes(panel, {
+				...state.panelDataset,
+				...state.dismiss_ownerAttribute
+			});
+		}),
+		bind("handleRendered", ({ root, state }) => {
+			const own = parts.get(root);
+			if (!own) return;
+			const { panel, handle } = own;
+			if (state.handleRendered !== true) handle.remove();
+			else if (handle.parentNode !== panel) lend(panel, DEFAULT_SLOT, handle, "start");
+		}),
+		bind("listAria", ({ root, state }) => {
+			const list = parts.get(root)?.list;
+			if (list) ownerAttributes(list, state.listAria);
+		}),
+		bind([
+			"drawnSections",
+			"groupSeparators",
+			"contentRendered"
+		], (ctx) => {
+			if (ctx.state.contentRendered !== true) return;
+			parts.get(ctx.root)?.rows?.draw(ctx, ctx.state.drawnSections, ctx.state.groupSeparators === true);
+		}),
+		bind("shown", ({ state, showSlot }) => {
+			showSlot("empty", (state.shown ?? []).length === 0);
+		})
+	]
+};
+//#endregion
+export { SELECT_ITEM_SLOTS, selectTemplate };

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

@@ -0,0 +1,9 @@
+import { SelectDescriptor, type DescriptorPluginOutputs, type DescriptorPluginProps } from '@soxa-ui/setup';
+import type { ISelect, TSelectCollectionFacade } from '@soxa-ui/core';
+import type { TBinding, TUpdateListener } from '../../adapter';
+/**
+ * Входы и выходы плагинов Select — их читает шаблон: пометку панели
+ * владельцем и `id` Select, проп `TIdPlugin`, который шаблон отдаёт полю.
+ */
+export type TSelectOutputs = DescriptorPluginProps<typeof SelectDescriptor> & DescriptorPluginOutputs<typeof SelectDescriptor>;
+export declare function setupSelect(host: HTMLElement, ctrl: ISelect | undefined, props: Record<string, unknown>, onUpdate: TUpdateListener): TBinding<ISelect, TSelectCollectionFacade, TSelectOutputs>;

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

@@ -0,0 +1,26 @@
+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 { SelectCollectionDescriptor, SelectDescriptor, TCollectionExtension, TFieldControlExtension, TVirtualCollectionExtension } from "@soxa-ui/setup";
+//#region src/components/select/setup.component.ts
+function setupSelect(host, ctrl, props, onUpdate) {
+	const elevator = createWebcElevator(host);
+	const adapter = createWebcAdapterContext(host, SelectDescriptor(), {
+		ctrl,
+		props
+	}).use(TFieldControlExtension, { elevator });
+	const collectionAdapter = createWebcAdapterContext(host, SelectCollectionDescriptor(), {
+		props,
+		options: {
+			owner: adapter.instance,
+			engine: props["engine"]
+		}
+	}, { bundle: adapter.bundle }).use(TCollectionExtension, { elevator }).use(TVirtualCollectionExtension, { elevator });
+	const facade = useCollectionAdapter(collectionAdapter, host, onUpdate);
+	const owner = useAdapter(adapter, host, onUpdate);
+	return joinBindings(owner, facade);
+}
+//#endregion
+export { setupSelect };

package/dist/components/skeleton/Skeleton.element.d.ts

@@ -0,0 +1,10 @@
+/**
+ * `<div is="so-skeleton">` — заглушка поверх содержимого (слот `default`).
+ * Видимость решает только, показана ли заглушка, поэтому корень база не прячет
+ * (`hides: false`): `display: none` спрятал бы и содержимое.
+ */
+import { SkeletonDescriptor } from '@soxa-ui/setup';
+import type { ISkeleton } from '@soxa-ui/core';
+import type { TElementClassOf, TElementType } from '../../adapter';
+export declare const TSkeletonElement: TElementClassOf<typeof HTMLDivElement, typeof SkeletonDescriptor, ISkeleton>;
+export type TSkeletonElementProps = TElementType<typeof TSkeletonElement>;

package/dist/components/skeleton/Skeleton.element.js

@@ -0,0 +1,24 @@
+import { defineElement } from "../../adapter/runtime/defineElement.js";
+import { ElementBase } from "../../adapter/runtime/element.base.js";
+import "../../adapter/index.js";
+import { skeletonTemplate } from "./skeleton.template.js";
+import { setupSkeleton } from "./setup.component.js";
+import { SkeletonDescriptor } from "@soxa-ui/setup";
+//#region src/components/skeleton/Skeleton.element.ts
+/**
+* `<div is="so-skeleton">` — заглушка поверх содержимого (слот `default`).
+* Видимость решает только, показана ли заглушка, поэтому корень база не прячет
+* (`hides: false`): `display: none` спрятал бы и содержимое.
+*/
+var TSkeletonElement = ElementBase(HTMLDivElement, {
+	descriptor: SkeletonDescriptor,
+	template: skeletonTemplate,
+	root: {
+		strategy: "host",
+		hides: false
+	},
+	setup: setupSkeleton
+});
+defineElement("so-skeleton", TSkeletonElement, "div");
+//#endregion
+export { TSkeletonElement };

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

@@ -0,0 +1,3 @@
+/** Application API for this element entry. */
+export { TSkeletonElement } from './Skeleton.element';
+export type { TSkeletonElementProps } from './Skeleton.element';

package/dist/components/skeleton/index.js

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

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

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

package/dist/components/skeleton/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 { SkeletonDescriptor } from "@soxa-ui/setup";
+//#region src/components/skeleton/setup.component.ts
+function setupSkeleton(host, ctrl, props, onUpdate) {
+	const adapter = createWebcAdapterContext(host, SkeletonDescriptor(), {
+		ctrl,
+		props
+	});
+	return useAdapter(adapter, host, onUpdate);
+}
+//#endregion
+export { setupSkeleton };

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

@@ -0,0 +1,8 @@
+/**
+ * Шаблон Skeleton: заглушка — первым узлом перед содержимым и только пока
+ * показана (`present`). `aria-hidden` — на ней, а не на корне: в корне
+ * содержимое.
+ */
+import type { ISkeleton } from '@soxa-ui/core';
+import { type ITemplate } from '../../adapter';
+export declare const skeletonTemplate: ITemplate<ISkeleton>;

package/dist/components/skeleton/skeleton.template.js

@@ -0,0 +1,25 @@
+import { bind } from "../../adapter/template/types.js";
+import "../../adapter/index.js";
+//#region src/components/skeleton/skeleton.template.ts
+/** Заглушка элемента — один узел на всё время жизни: привязка вставляет и вынимает его. */
+var placeholders = /* @__PURE__ */ new WeakMap();
+var skeletonTemplate = {
+	create: (root) => {
+		const placeholder = root.ownerDocument.createElement("div");
+		placeholder.className = "so-skeleton__placeholder";
+		placeholder.setAttribute("aria-hidden", "true");
+		placeholders.set(root, placeholder);
+		return { slots: { default: {
+			mode: "append",
+			node: root
+		} } };
+	},
+	bindings: [bind("present", ({ root, state }) => {
+		const placeholder = placeholders.get(root);
+		if (!placeholder) return;
+		if (!state.present) placeholder.remove();
+		else if (root.firstChild !== placeholder) root.prepend(placeholder);
+	})]
+};
+//#endregion
+export { skeletonTemplate };

package/dist/components/slider/Slider.element.d.ts

@@ -0,0 +1,11 @@
+/**
+ * `<span is="so-slider">` — ползунок: ручки на рельсе, заливка и метки. Тег
+ * строчный: ползунок кладут в подпись `Label`. Набор корня — `rootAria`
+ * (группа нескольких ручек), `aria` — полям ручек. docs/architecture.md,
+ * Layer 8d, «Поле».
+ */
+import { SliderDescriptor } from '@soxa-ui/setup';
+import type { ISlider } from '@soxa-ui/core';
+import type { TElementClassOf, TElementType } from '../../adapter';
+export declare const TSliderElement: TElementClassOf<typeof HTMLSpanElement, typeof SliderDescriptor, ISlider>;
+export type TSliderElementProps = TElementType<typeof TSliderElement>;

package/dist/components/slider/Slider.element.js

@@ -0,0 +1,25 @@
+import { defineElement } from "../../adapter/runtime/defineElement.js";
+import { ElementBase } from "../../adapter/runtime/element.base.js";
+import "../../adapter/index.js";
+import { sliderTemplate } from "./slider.template.js";
+import { setupSlider } from "./setup.component.js";
+import { SliderDescriptor } from "@soxa-ui/setup";
+//#region src/components/slider/Slider.element.ts
+/**
+* `<span is="so-slider">` — ползунок: ручки на рельсе, заливка и метки. Тег
+* строчный: ползунок кладут в подпись `Label`. Набор корня — `rootAria`
+* (группа нескольких ручек), `aria` — полям ручек. docs/architecture.md,
+* Layer 8d, «Поле».
+*/
+var TSliderElement = ElementBase(HTMLSpanElement, {
+	descriptor: SliderDescriptor,
+	template: sliderTemplate,
+	root: {
+		strategy: "host",
+		aria: "rootAria"
+	},
+	setup: setupSlider
+});
+defineElement("so-slider", TSliderElement, "span");
+//#endregion
+export { TSliderElement };

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

@@ -0,0 +1,3 @@
+/** Application API for this element entry. */
+export { TSliderElement } from './Slider.element';
+export type { TSliderElementProps } from './Slider.element';

package/dist/components/slider/index.js

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

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

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

package/dist/components/slider/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 { SliderDescriptor, TFieldControlExtension } from "@soxa-ui/setup";
+//#region src/components/slider/setup.component.ts
+function setupSlider(host, ctrl, props, onUpdate) {
+	const adapter = createWebcAdapterContext(host, SliderDescriptor(), {
+		ctrl,
+		props
+	}).use(TFieldControlExtension, { elevator: createWebcElevator(host) });
+	return useAdapter(adapter, host, onUpdate);
+}
+//#endregion
+export { setupSlider };

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

@@ -0,0 +1,8 @@
+/**
+ * Шаблон Slider: дорожка с заливкой, блоком меток и ручками, поле `range` в
+ * каждой ручке. Части плагины находят только прямыми детьми; всё — `span`, как
+ * требует подпись `Label`. docs/architecture.md, Layer 8d, «Поле».
+ */
+import type { ISlider } from '@soxa-ui/core';
+import { type ITemplate } from '../../adapter';
+export declare const sliderTemplate: ITemplate<ISlider>;

package/dist/components/slider/slider.template.js

@@ -0,0 +1,149 @@
+import { bind } from "../../adapter/template/types.js";
+import { ownerAttributes, ownerStyles } from "../../adapter/template/owner.js";
+import { patch, sampleOf } from "../../adapter/template/parts.js";
+import { TKeyedLoop } from "../../adapter/template/loop.js";
+import "../../adapter/index.js";
+//#region src/components/slider/slider.template.ts
+var parts = /* @__PURE__ */ new WeakMap();
+var labels = /* @__PURE__ */ new WeakMap();
+var fields = /* @__PURE__ */ new WeakMap();
+var tooltips = /* @__PURE__ */ new WeakMap();
+/** Узлы с копией образца: своё они не пишут. */
+var sampled = /* @__PURE__ */ new WeakSet();
+function placed(entries) {
+	return (entries ?? []).map((entry, index) => ({
+		entry,
+		index
+	}));
+}
+function fillFrom(ctx, node, slot) {
+	const copy = sampleOf(ctx, slot);
+	if (!copy) return;
+	node.appendChild(copy);
+	sampled.add(node);
+}
+function writeText(node, text) {
+	if (!sampled.has(node) && node.textContent !== text) node.textContent = text;
+}
+function markOf(ctx) {
+	const { ownerDocument } = ctx.root;
+	const mark = ownerDocument.createElement("span");
+	const label = ownerDocument.createElement("span");
+	mark.className = "so-slider__mark";
+	label.className = "so-slider__mark-label";
+	fillFrom(ctx, label, "mark");
+	mark.appendChild(label);
+	labels.set(mark, label);
+	return mark;
+}
+function applyMark(mark, entry) {
+	const label = labels.get(mark);
+	ownerStyles(mark, entry.style);
+	ownerAttributes(mark, entry.dataset);
+	if (label) writeText(label, entry.label ?? "");
+}
+function thumbOf(ctx) {
+	const { ownerDocument } = ctx.root;
+	const thumb = ownerDocument.createElement("span");
+	const field = ownerDocument.createElement("input");
+	thumb.className = "so-slider__thumb";
+	field.className = "so-slider__input";
+	field.type = "range";
+	thumb.appendChild(field);
+	fields.set(thumb, field);
+	return thumb;
+}
+/** Под `aria-hidden`: значение объявляет поле, а в подписи `Label` текст вошёл бы в его имя. */
+function tooltipOf(ctx, thumb) {
+	const known = tooltips.get(thumb);
+	if (known) return known;
+	const tooltip = ctx.root.ownerDocument.createElement("span");
+	tooltip.className = "so-slider__tooltip";
+	tooltip.setAttribute("aria-hidden", "true");
+	fillFrom(ctx, tooltip, "thumb");
+	tooltips.set(thumb, tooltip);
+	return tooltip;
+}
+/** Ход раньше значения: записанное до нового `max`, оно встало бы на прежний край. */
+function applyField(ctx, field, entry) {
+	const { state } = ctx;
+	const value = String(entry.value);
+	field.min = String(entry.min);
+	field.max = String(entry.max);
+	field.step = String(entry.step);
+	patch(field, { value });
+	if (state.name === void 0) field.removeAttribute("name");
+	else field.name = state.name;
+	field.disabled = state.disabled === true;
+	ownerAttributes(field, entry.aria);
+}
+function applyThumb(ctx, thumb, entry) {
+	const field = fields.get(thumb);
+	ownerStyles(thumb, entry.style);
+	ownerAttributes(thumb, entry.dataset);
+	if (field) applyField(ctx, field, entry);
+	if (ctx.state.tooltipRendered !== true) {
+		tooltips.get(thumb)?.remove();
+		return;
+	}
+	const tooltip = tooltipOf(ctx, thumb);
+	writeText(tooltip, String(entry.value));
+	if (tooltip.parentNode !== thumb) thumb.appendChild(tooltip);
+}
+var sliderTemplate = {
+	create: (root) => {
+		const { ownerDocument } = root;
+		const track = ownerDocument.createElement("span");
+		const range = ownerDocument.createElement("span");
+		const marks = ownerDocument.createElement("span");
+		track.className = "so-slider__track";
+		range.className = "so-slider__range";
+		marks.className = "so-slider__marks";
+		marks.setAttribute("aria-hidden", "true");
+		track.appendChild(range);
+		root.appendChild(track);
+		parts.set(root, {
+			track,
+			range,
+			marks,
+			markLoop: new TKeyedLoop(marks, null, (mark) => mark.index),
+			thumbLoop: new TKeyedLoop(track, null, (thumb) => thumb.index)
+		});
+		return { slots: {
+			mark: { mode: "sample" },
+			thumb: { mode: "sample" }
+		} };
+	},
+	bindings: [
+		bind("rangeStyle", ({ root, state }) => {
+			const range = parts.get(root)?.range;
+			if (range) ownerStyles(range, state.rangeStyle);
+		}),
+		bind("shownMarks", (ctx) => {
+			const own = parts.get(ctx.root);
+			if (!own) return;
+			const shown = placed(ctx.state.shownMarks);
+			own.markLoop.draw(shown, ({ entry }) => {
+				const mark = markOf(ctx);
+				applyMark(mark, entry);
+				return mark;
+			}, (mark, { entry }) => applyMark(mark, entry));
+			if (shown.length === 0) own.marks.remove();
+			else if (own.marks.parentNode !== own.track) own.range.after(own.marks);
+		}),
+		bind([
+			"thumbs",
+			"name",
+			"disabled",
+			"tooltipRendered"
+		], (ctx) => {
+			parts.get(ctx.root)?.thumbLoop.draw(placed(ctx.state.thumbs), ({ entry }) => {
+				const thumb = thumbOf(ctx);
+				applyThumb(ctx, thumb, entry);
+				return thumb;
+			}, (thumb, { entry }) => applyThumb(ctx, thumb, entry));
+		})
+	]
+};
+//#endregion
+export { sliderTemplate };

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

@@ -0,0 +1 @@
+export { setupStylable } from './setup.component';

package/dist/components/stylable/index.js

@@ -0,0 +1 @@
+import "./setup.component.js";

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

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

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

@@ -0,0 +1,2 @@
+import "../../adapter/index.js";
+import "@soxa-ui/setup";

package/dist/components/switch/Switch.element.d.ts

@@ -0,0 +1,9 @@
+/**
+ * `<span is="so-switch">` — переключатель с нативным `<input type="checkbox">`
+ * внутри; `span` — его кладут в `Label`. docs/architecture.md, Layer 8d, «Поле».
+ */
+import { SwitchDescriptor } from '@soxa-ui/setup';
+import type { ISwitch } from '@soxa-ui/core';
+import type { TElementClassOf, TElementType } from '../../adapter';
+export declare const TSwitchElement: TElementClassOf<typeof HTMLSpanElement, typeof SwitchDescriptor, ISwitch>;
+export type TSwitchElementProps = TElementType<typeof TSwitchElement>;

package/dist/components/switch/Switch.element.js

@@ -0,0 +1,24 @@
+import { defineElement } from "../../adapter/runtime/defineElement.js";
+import { ElementBase } from "../../adapter/runtime/element.base.js";
+import "../../adapter/index.js";
+import { switchTemplate } from "./switch.template.js";
+import { setupSwitch } from "./setup.component.js";
+import { SwitchDescriptor } from "@soxa-ui/setup";
+//#region src/components/switch/Switch.element.ts
+/**
+* `<span is="so-switch">` — переключатель с нативным `<input type="checkbox">`
+* внутри; `span` — его кладут в `Label`. docs/architecture.md, Layer 8d, «Поле».
+*/
+var TSwitchElement = ElementBase(HTMLSpanElement, {
+	descriptor: SwitchDescriptor,
+	template: switchTemplate,
+	root: {
+		strategy: "host",
+		sets: ["attrs", "dataset"],
+		control: true
+	},
+	setup: setupSwitch
+});
+defineElement("so-switch", TSwitchElement, "span");
+//#endregion
+export { TSwitchElement };

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

@@ -0,0 +1,3 @@
+/** Application API for this element entry. */
+export { TSwitchElement } from './Switch.element';
+export type { TSwitchElementProps } from './Switch.element';

package/dist/components/switch/index.js

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

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

@@ -0,0 +1,7 @@
+import { SwitchDescriptor } from '@soxa-ui/setup';
+import type { DescriptorPluginProps } from '@soxa-ui/setup';
+import type { ISwitch } from '@soxa-ui/core';
+import type { TBinding, TUpdateListener } from '../../adapter';
+/** Сверх инстанса шаблон читает входы плагинов: `id` поля — проп `TIdPlugin`. */
+export type TSwitchOutputs = DescriptorPluginProps<typeof SwitchDescriptor>;
+export declare function setupSwitch(host: HTMLElement, ctrl: ISwitch | undefined, props: Record<string, unknown>, onUpdate: TUpdateListener): TBinding<ISwitch, unknown, TSwitchOutputs>;