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

package/dist/components/tabs/content/Content.js

@@ -0,0 +1,18 @@
+"use client";
+import { toRootProps } from "../../../adapter/common/root.js";
+import { renderSlot } from "../../../adapter/common/slots.js";
+import { useSetupTabsContent } from "./setup.component.js";
+import { jsx } from "react/jsx-runtime";
+//#region src/components/tabs/content/Content.tsx
+/** TabsContent — панель таба: рисуется, пока активен таб того же `value`. */
+function TabsContent(props) {
+	const { ref, forwardProps, state } = useSetupTabsContent(props);
+	const { rendered, active, tag, attrs, aria } = state;
+	if (!rendered || !active) return null;
+	return /* @__PURE__ */ jsx(tag, {
+		...toRootProps(ref, state, [attrs, aria], forwardProps),
+		children: renderSlot(props.children)
+	});
+}
+//#endregion
+export { TabsContent };

package/dist/components/tabs/content/base.component.d.ts

@@ -0,0 +1,7 @@
+import type { ITabsContent } from '@soxa-ui/core';
+import type { TabsCollectionContentDescriptor, TabsContentDescriptor } from '@soxa-ui/setup';
+import type { EventProps, UseDomProps } from '../../../types';
+/** События панели — свои и фасада. */
+export type TabsContentEventProps = EventProps<typeof TabsContentDescriptor> & EventProps<typeof TabsCollectionContentDescriptor>;
+/** Пропсы панели: `value` связывает её с табом того же значения. */
+export type TabsContentProps = UseDomProps<typeof TabsContentDescriptor, ITabsContent, TabsContentEventProps>;

package/dist/components/tabs/content/index.d.ts

@@ -0,0 +1,2 @@
+export * from './base.component';
+export { TabsContent } from './Content';

package/dist/components/tabs/content/setup.component.d.ts

@@ -0,0 +1,17 @@
+import type { TabsContentProps } from './base.component';
+export declare function useSetupTabsContent(props: TabsContentProps): import("../../../adapter").TCollectionBinding<import("../../../adapter").TBinding<import("@soxa-ui/setup").TContextContract<import("@soxa-ui/core").ITabsContent<import("@soxa-ui/core").ITabsContentProps, import("@soxa-ui/core").TTabsContentEvents>, {
+    props: object & {} & {} & {
+        id?: string | undefined;
+    } & {};
+    events: object & {
+        "element:removed": () => void;
+        "element:ready": (element: Element) => void;
+    } & {} & {
+        "change:id": (payload: import("@soxa-ui/core").TValuePayload<string | undefined>) => void;
+    } & {};
+    outputs: object & {} & {} & {} & {};
+}>, TabsContentProps>, import("@soxa-ui/setup").TContextContract<import("@soxa-ui/core").TTabsContentCollectionFacade, {
+    props: object;
+    events: object;
+    outputs: object;
+}>, TabsContentProps>;

package/dist/components/tabs/content/setup.component.js

@@ -0,0 +1,20 @@
+"use client";
+import { useAdapter, useCollectionAdapter } from "../../../adapter/runtime/useAdapter.js";
+import { useAdapterContext } from "../../../adapter/runtime/useAdapterContext.js";
+import { TTabsContentBindingExtension, TabsCollectionContentDescriptor, TabsContentDescriptor } from "@soxa-ui/setup";
+//#region src/components/tabs/content/setup.component.ts
+function useSetupTabsContent(props) {
+	const { contexts: [adapter, content] } = useAdapterContext((create, elevator) => {
+		const adapter = create(TabsContentDescriptor(), {
+			ctrl: props.ctrl,
+			props
+		});
+		return [adapter, create(TabsCollectionContentDescriptor(), { props }, { bundle: adapter.bundle }).use(TTabsContentBindingExtension, {
+			adapter,
+			elevator
+		})];
+	});
+	return useCollectionAdapter(useAdapter(adapter, props), content, props);
+}
+//#endregion
+export { useSetupTabsContent };

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

@@ -0,0 +1,9 @@
+import { Tabs as TabsComponent } from './Tabs';
+import { TabsContent } from './content';
+export * from './base.component';
+export * from './item';
+export * from './content';
+export declare const Tabs: typeof TabsComponent & {
+    Item: import("react").NamedExoticComponent<import("./item").TabsItemProps>;
+    Content: typeof TabsContent;
+};

package/dist/components/tabs/index.js

@@ -0,0 +1,11 @@
+import { TabsItem } from "./item/Item.js";
+import { Tabs as Tabs$1 } from "./Tabs.js";
+import { TabsContent } from "./content/Content.js";
+import { withParts } from "@soxa-ui/setup";
+//#region src/components/tabs/index.ts
+var Tabs = withParts(Tabs$1, {
+	Item: TabsItem,
+	Content: TabsContent
+});
+//#endregion
+export { Tabs };

package/dist/components/tabs/item/Item.d.ts

@@ -0,0 +1,6 @@
+import type { TabsItemProps } from './base.component';
+/**
+ * TabsItem — таб: строка `Button` с `role="tab"` и кнопка закрытия рядом с
+ * ней. Атрибуты потребителя — строке: AGENTS.md (React), «Корень и `ref` потребителя».
+ */
+export declare const TabsItem: import("react").NamedExoticComponent<TabsItemProps>;

package/dist/components/tabs/item/Item.js

@@ -0,0 +1,64 @@
+"use client";
+import { toAriaProps } from "../../../adapter/common/aria.js";
+import { toControlAttrs, toRootForward, toRootProps } from "../../../adapter/common/root.js";
+import { renderSlot } from "../../../adapter/common/slots.js";
+import { roleIcon } from "../../../adapter/common/icon.js";
+import { useClickAction } from "../../../adapter/runtime/useClickAction.js";
+import { withRenderBoundary } from "../../../adapter/runtime/withRenderBoundary.js";
+import { Button } from "../../button/Button.js";
+import { Icon } from "../../icon/Icon.js";
+import { useSetupTabsItem } from "./setup.component.js";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/components/tabs/item/Item.tsx
+/**
+* TabsItem — таб: строка `Button` с `role="tab"` и кнопка закрытия рядом с
+* ней. Атрибуты потребителя — строке: AGENTS.md (React), «Корень и `ref` потребителя».
+*/
+var TabsItem = withRenderBoundary(function TabsItem(props) {
+	const { ref, forwardProps, state, context } = useSetupTabsItem(props);
+	const activate = useClickAction(() => {
+		if (context) context.adapters.activation.active = true;
+	});
+	const close = useClickAction((event) => {
+		event.stopPropagation();
+		context?.adapters.tabs.close();
+	});
+	const { rendered, tag, text, disabled, size, variant, active, tab_closable, closeAria, aria, dataset, attrs } = state;
+	if (!rendered) return null;
+	const Tag = tag;
+	const row = toControlAttrs(forwardProps);
+	return /* @__PURE__ */ jsxs(Tag, {
+		...toRootProps(ref, state, [dataset, attrs], toRootForward(forwardProps)),
+		children: [/* @__PURE__ */ jsx(Button, {
+			embedded: "tabs.row",
+			type: "button",
+			disabled,
+			size,
+			variant,
+			...toAriaProps(aria),
+			...row,
+			ref: activate,
+			leading: renderSlot(props.leading),
+			trailing: renderSlot(props.trailing),
+			children: renderSlot(props.children, {
+				text: text ?? "",
+				active: active ?? false
+			}) ?? text
+		}), tab_closable === true ? /* @__PURE__ */ jsx(Button, {
+			embedded: "tabs.close",
+			type: "button",
+			className: "so-tabs-item__close",
+			disabled,
+			size,
+			...toAriaProps(closeAria),
+			ref: close,
+			children: renderSlot(props["close-icon"]) ?? /* @__PURE__ */ jsx(Icon, {
+				embedded: "tabs.close-icon",
+				tag: roleIcon("close"),
+				size
+			})
+		}) : null]
+	});
+});
+//#endregion
+export { TabsItem };

package/dist/components/tabs/item/base.component.d.ts

@@ -0,0 +1,9 @@
+import type { HTMLAttributes } from 'react';
+import type { ITabsItem } from '@soxa-ui/core';
+import type { TabsCollectionItemDescriptor, TabsItemDescriptor } from '@soxa-ui/setup';
+import type { EventProps, TDomAttributes, UseDomProps } from '../../../types';
+/** События таба — свои и фасада. */
+export type TabsItemEventProps = EventProps<typeof TabsItemDescriptor> & EventProps<typeof TabsCollectionItemDescriptor>;
+/** Атрибуты таба: класс и стиль — корню, остальное — строке с `role="tab"`. */
+export type TabsItemAttributes = TDomAttributes<typeof TabsItemDescriptor, HTMLAttributes<HTMLElement>, TabsItemEventProps>;
+export type TabsItemProps = UseDomProps<typeof TabsItemDescriptor, ITabsItem, TabsItemEventProps>;

package/dist/components/tabs/item/index.d.ts

@@ -0,0 +1,2 @@
+export * from './base.component';
+export { TabsItem } from './Item';

package/dist/components/tabs/item/setup.component.d.ts

@@ -0,0 +1,17 @@
+import type { TabsItemProps } from './base.component';
+export declare function useSetupTabsItem(props: TabsItemProps): {
+    context: import("@soxa-ui/core").TItemContext<import("@soxa-ui/core").ITabsItem<import("@soxa-ui/core").ITabsItemProps, import("@soxa-ui/core").TTabsItemEvents<any>>, import("@soxa-ui/core").TTabsCollectionExtensions> | undefined;
+    ref: (el: Element | null) => void;
+    plugins: import("@soxa-ui/plugins").IPluginBundle | null;
+    ctrl: object & import("@soxa-ui/core").ITabsItem<import("@soxa-ui/core").ITabsItemProps, import("@soxa-ui/core").TTabsItemEvents<any>>;
+    root: import("../../../adapter").TRootSource;
+    forwardProps: Partial<TabsItemProps>;
+    bindRef: (el: Element | null) => void;
+    state: import("@soxa-ui/setup").TInstanceState<object & import("@soxa-ui/core").ITabsItem<import("@soxa-ui/core").ITabsItemProps, import("@soxa-ui/core").TTabsItemEvents<any>>> & import("@soxa-ui/setup").TInstanceState<object & {} & {} & {} & {
+        aria_label?: string | undefined;
+        aria_labelledBy?: string | undefined;
+        aria_describedBy?: string | undefined;
+    } & {} & {
+        id?: string | undefined;
+    } & {} & {}> & import("@soxa-ui/setup").TInstanceState<object & {} & {} & {} & {} & {} & {} & {} & {}> & import("@soxa-ui/setup").TInstanceState<object & import("@soxa-ui/core").TTabsItemCollectionFacade> & object;
+};

package/dist/components/tabs/item/setup.component.js

@@ -0,0 +1,23 @@
+"use client";
+import { useAdapter, useCollectionAdapter } from "../../../adapter/runtime/useAdapter.js";
+import { useAdapterContext } from "../../../adapter/runtime/useAdapterContext.js";
+import { TCollectionItemExtension, TabsCollectionItemDescriptor, TabsItemDescriptor } from "@soxa-ui/setup";
+//#region src/components/tabs/item/setup.component.ts
+function useSetupTabsItem(props) {
+	const { contexts: [adapter, item] } = useAdapterContext((create, elevator) => {
+		const adapter = create(TabsItemDescriptor(), {
+			ctrl: props.ctrl,
+			props
+		});
+		return [adapter, create(TabsCollectionItemDescriptor(), { props }, { bundle: adapter.bundle }).use(TCollectionItemExtension, {
+			adapter,
+			elevator
+		})];
+	});
+	return {
+		...useCollectionAdapter(useAdapter(adapter, props), item, props),
+		context: item.instance.context
+	};
+}
+//#endregion
+export { useSetupTabsItem };

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

@@ -0,0 +1,15 @@
+import type { TabsProps } from './base.component';
+export declare function useSetupTabs(props: TabsProps): {
+    layer: import("../../adapter").TElevatorLayer;
+    ref: (el: Element | null) => void;
+    plugins: import("@soxa-ui/plugins").IPluginBundle | null;
+    ctrl: object & import("@soxa-ui/core").ITabs;
+    root: import("../../adapter").TRootSource;
+    forwardProps: Partial<TabsProps>;
+    bindRef: (el: Element | null) => void;
+    state: import("@soxa-ui/setup").TInstanceState<object & import("@soxa-ui/core").ITabs> & import("@soxa-ui/setup").TInstanceState<object & {} & {} & {} & {
+        aria_label?: string | undefined;
+        aria_labelledBy?: string | undefined;
+        aria_describedBy?: string | undefined;
+    } & {} & {} & {} & {} & {} & {} & {}> & import("@soxa-ui/setup").TInstanceState<object & {} & {} & {} & {} & {} & {} & {} & {} & {} & {} & {}> & import("@soxa-ui/setup").TInstanceState<object & import("@soxa-ui/core").TTabsCollectionFacade> & object;
+};

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

@@ -0,0 +1,26 @@
+"use client";
+import { useAdapter, useCollectionAdapter } from "../../adapter/runtime/useAdapter.js";
+import { useAdapterContext } from "../../adapter/runtime/useAdapterContext.js";
+import { TCollectionExtension, TDragAndDropCollectionExtension, TabsCollectionDescriptor, TabsDescriptor } from "@soxa-ui/setup";
+//#region src/components/tabs/setup.component.ts
+function useSetupTabs(props) {
+	const { contexts: [adapter, collectionAdapter], layer } = useAdapterContext((create, elevator) => {
+		const adapter = create(TabsDescriptor(), {
+			ctrl: props.ctrl,
+			props
+		});
+		return [adapter, create(TabsCollectionDescriptor(), {
+			props,
+			options: {
+				owner: adapter.instance,
+				engine: props.engine
+			}
+		}, { bundle: adapter.bundle }).use(TCollectionExtension, { elevator }).use(TDragAndDropCollectionExtension, { elevator })];
+	});
+	return {
+		...useCollectionAdapter(useAdapter(adapter, props), collectionAdapter, props),
+		layer
+	};
+}
+//#endregion
+export { useSetupTabs };

package/dist/components/tags/Tags.d.ts

@@ -0,0 +1,7 @@
+import type { ReactElement } from 'react';
+import type { TagsProps } from './base.component';
+/**
+ * Tags — набор тегов: ряд с ролью, в нём показанные теги (`shown`).
+ * docs/agents/patterns.md, «Готовые паттерны» (Tags).
+ */
+export declare function Tags(props: TagsProps): ReactElement | null;

package/dist/components/tags/Tags.js

@@ -0,0 +1,36 @@
+"use client";
+import { toRootProps } from "../../adapter/common/root.js";
+import { hasSlot, relaySlot, renderSlot } from "../../adapter/common/slots.js";
+import { Elevate } from "../../adapter/elevator/Elevate.js";
+import { TagsItem } from "./item/Item.js";
+import { useSetupTags } from "./setup.component.js";
+import { jsx } from "react/jsx-runtime";
+//#region src/components/tags/Tags.tsx
+/**
+* Tags — набор тегов: ряд с ролью, в нём показанные теги (`shown`).
+* docs/agents/patterns.md, «Готовые паттерны» (Tags).
+*/
+function Tags(props) {
+	const { ref, forwardProps, state, layer } = useSetupTags(props);
+	const { rendered, shown, attrs, aria, dataset } = state;
+	if (!rendered) return null;
+	return /* @__PURE__ */ jsx("div", {
+		...toRootProps(ref, state, [
+			attrs,
+			aria,
+			dataset
+		], forwardProps),
+		children: /* @__PURE__ */ jsx(Elevate, {
+			layer,
+			children: hasSlot(props.children) ? renderSlot(props.children, { shown: shown ?? [] }) : shown?.map((item) => /* @__PURE__ */ jsx(TagsItem, {
+				ctrl: item,
+				leading: renderSlot(props["item-leading"], { item }),
+				trailing: renderSlot(props["item-trailing"], { item }),
+				"close-icon": renderSlot(props["item-close-icon"], { item }),
+				children: relaySlot(props.item, { item })
+			}, item.uid))
+		})
+	});
+}
+//#endregion
+export { Tags };

package/dist/components/tags/base.component.d.ts

@@ -0,0 +1,6 @@
+import type { ITags } from '@soxa-ui/core';
+import type { TagsCollectionDescriptor, TagsDescriptor } from '@soxa-ui/setup';
+import type { EventProps, UseDomProps } from '../../types';
+/** Колбэки обоих контекстов набора — свой и фасада коллекции — пропсы одного компонента. */
+export type TagsEventProps = EventProps<typeof TagsDescriptor> & EventProps<typeof TagsCollectionDescriptor>;
+export type TagsProps = UseDomProps<typeof TagsDescriptor, ITags, TagsEventProps>;

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

@@ -0,0 +1,6 @@
+import { Tags as TagsComponent } from './Tags';
+export * from './base.component';
+export * from './item';
+export declare const Tags: typeof TagsComponent & {
+    Item: import("react").NamedExoticComponent<import("./item").TagsItemProps>;
+};

package/dist/components/tags/index.js

@@ -0,0 +1,7 @@
+import { TagsItem } from "./item/Item.js";
+import { Tags as Tags$1 } from "./Tags.js";
+import { withParts } from "@soxa-ui/setup";
+//#region src/components/tags/index.ts
+var Tags = withParts(Tags$1, { Item: TagsItem });
+//#endregion
+export { Tags };

package/dist/components/tags/item/Item.d.ts

@@ -0,0 +1,6 @@
+import type { TagsItemProps } from './base.component';
+/**
+ * TagsItem — тег: корень-пилюля по `tag`, в нём строка — `ItemRow` на `div` — и крестик рядом
+ * со строкой, а не в ней: потомки опции для скринридера презентационны.
+ */
+export declare const TagsItem: import("react").NamedExoticComponent<TagsItemProps>;

package/dist/components/tags/item/Item.js

@@ -0,0 +1,63 @@
+"use client";
+import { toAriaProps } from "../../../adapter/common/aria.js";
+import { toControlAttrs, toRootForward, toRootProps } from "../../../adapter/common/root.js";
+import { renderSlot } from "../../../adapter/common/slots.js";
+import { roleIcon } from "../../../adapter/common/icon.js";
+import { useClickAction } from "../../../adapter/runtime/useClickAction.js";
+import { withRenderBoundary } from "../../../adapter/runtime/withRenderBoundary.js";
+import { Button } from "../../button/Button.js";
+import { Icon } from "../../icon/Icon.js";
+import { ItemRow } from "../../item-row/ItemRow.js";
+import { useSetupTagsItem } from "./setup.component.js";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/components/tags/item/Item.tsx
+/** Глиф крестика без слота — компонент на роль: `tag` у Icon — корень, а не роль. */
+var CloseIcon = roleIcon("close");
+/**
+* TagsItem — тег: корень-пилюля по `tag`, в нём строка — `ItemRow` на `div` — и крестик рядом
+* со строкой, а не в ней: потомки опции для скринридера презентационны.
+*/
+var TagsItem = withRenderBoundary(function TagsItem(props) {
+	const { ref, forwardProps, state, context } = useSetupTagsItem(props);
+	const close = useClickAction((event) => {
+		event.stopPropagation();
+		context?.adapters.tags.close();
+	});
+	const { rendered, tag, text, direction, disabled, size, variant, selected, tag_closable, closeAria, aria, dataset, attrs } = state;
+	if (!rendered) return null;
+	return /* @__PURE__ */ jsxs(tag, {
+		...toRootProps(ref, state, [dataset, attrs], toRootForward(forwardProps)),
+		children: [/* @__PURE__ */ jsx(ItemRow, {
+			embedded: "tags.row",
+			tag: "div",
+			direction,
+			disabled,
+			size,
+			variant,
+			...toAriaProps(aria),
+			...toControlAttrs(forwardProps),
+			onActionPress: () => context?.adapters.selection.toggle(),
+			leading: renderSlot(props.leading),
+			trailing: renderSlot(props.trailing),
+			children: renderSlot(props.children, {
+				text: text ?? "",
+				selected: selected ?? false
+			}) ?? text
+		}), tag_closable === true ? /* @__PURE__ */ jsx(Button, {
+			embedded: "tags.close",
+			type: "button",
+			className: "so-tags-item__close",
+			disabled,
+			size,
+			...toAriaProps(closeAria),
+			ref: close,
+			children: renderSlot(props["close-icon"]) ?? /* @__PURE__ */ jsx(Icon, {
+				embedded: "tags.close-icon",
+				tag: CloseIcon,
+				size
+			})
+		}) : null]
+	});
+});
+//#endregion
+export { TagsItem };

package/dist/components/tags/item/base.component.d.ts

@@ -0,0 +1,8 @@
+import type { HTMLAttributes } from 'react';
+import type { ITagsItem } from '@soxa-ui/core';
+import type { TagsCollectionItemDescriptor, TagsItemDescriptor } from '@soxa-ui/setup';
+import type { EventProps, TDomAttributes, UseDomProps } from '../../../types';
+export type TagsItemEventProps = EventProps<typeof TagsItemDescriptor> & EventProps<typeof TagsCollectionItemDescriptor>;
+/** Атрибуты тега: класс и стиль — корню, остальное — строке. */
+export type TagsItemAttributes = TDomAttributes<typeof TagsItemDescriptor, HTMLAttributes<HTMLElement>, TagsItemEventProps>;
+export type TagsItemProps = UseDomProps<typeof TagsItemDescriptor, ITagsItem, TagsItemEventProps>;

package/dist/components/tags/item/index.d.ts

@@ -0,0 +1,2 @@
+export * from './base.component';
+export { TagsItem } from './Item';

package/dist/components/tags/item/setup.component.d.ts

@@ -0,0 +1,15 @@
+import type { TagsItemProps } from './base.component';
+export declare function useSetupTagsItem(props: TagsItemProps): {
+    context: import("@soxa-ui/core").TItemContext<import("@soxa-ui/core").ITagsItem<import("@soxa-ui/core").ITagsItemProps, import("@soxa-ui/core").TTagsItemEvents>, import("@soxa-ui/core").TTagsCollectionExtensions> | undefined;
+    ref: (el: Element | null) => void;
+    plugins: import("@soxa-ui/plugins").IPluginBundle | null;
+    ctrl: object & import("@soxa-ui/core").ITagsItem<import("@soxa-ui/core").ITagsItemProps, import("@soxa-ui/core").TTagsItemEvents>;
+    root: import("../../../adapter").TRootSource;
+    forwardProps: Partial<TagsItemProps>;
+    bindRef: (el: Element | null) => void;
+    state: import("@soxa-ui/setup").TInstanceState<object & import("@soxa-ui/core").ITagsItem<import("@soxa-ui/core").ITagsItemProps, import("@soxa-ui/core").TTagsItemEvents>> & import("@soxa-ui/setup").TInstanceState<object & {} & {} & {} & {
+        aria_label?: string | undefined;
+        aria_labelledBy?: string | undefined;
+        aria_describedBy?: string | undefined;
+    } & {} & {}> & import("@soxa-ui/setup").TInstanceState<object & {} & {} & {} & {} & {} & {}> & import("@soxa-ui/setup").TInstanceState<object & import("@soxa-ui/core").TTagsItemCollectionFacade> & object;
+};

package/dist/components/tags/item/setup.component.js

@@ -0,0 +1,23 @@
+"use client";
+import { useAdapter, useCollectionAdapter } from "../../../adapter/runtime/useAdapter.js";
+import { useAdapterContext } from "../../../adapter/runtime/useAdapterContext.js";
+import { TCollectionItemExtension, TagsCollectionItemDescriptor, TagsItemDescriptor } from "@soxa-ui/setup";
+//#region src/components/tags/item/setup.component.ts
+function useSetupTagsItem(props) {
+	const { contexts: [adapter, item] } = useAdapterContext((create, elevator) => {
+		const adapter = create(TagsItemDescriptor(), {
+			ctrl: props.ctrl,
+			props
+		});
+		return [adapter, create(TagsCollectionItemDescriptor(), { props }, { bundle: adapter.bundle }).use(TCollectionItemExtension, {
+			adapter,
+			elevator
+		})];
+	});
+	return {
+		...useCollectionAdapter(useAdapter(adapter, props), item, props),
+		context: item.instance.context
+	};
+}
+//#endregion
+export { useSetupTagsItem };

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

@@ -0,0 +1,15 @@
+import type { TagsProps } from './base.component';
+export declare function useSetupTags(props: TagsProps): {
+    layer: import("../../adapter").TElevatorLayer;
+    ref: (el: Element | null) => void;
+    plugins: import("@soxa-ui/plugins").IPluginBundle | null;
+    ctrl: object & import("@soxa-ui/core").ITags<import("@soxa-ui/core").ITagsProps, import("@soxa-ui/core").TTagsEvents>;
+    root: import("../../adapter").TRootSource;
+    forwardProps: Partial<TagsProps>;
+    bindRef: (el: Element | null) => void;
+    state: import("@soxa-ui/setup").TInstanceState<object & import("@soxa-ui/core").ITags<import("@soxa-ui/core").ITagsProps, import("@soxa-ui/core").TTagsEvents>> & import("@soxa-ui/setup").TInstanceState<object & {} & {} & {} & {
+        aria_label?: string | undefined;
+        aria_labelledBy?: string | undefined;
+        aria_describedBy?: string | undefined;
+    } & {} & {} & {} & {} & {}> & import("@soxa-ui/setup").TInstanceState<object & {} & {} & {} & {} & {} & {} & {} & {} & {}> & import("@soxa-ui/setup").TInstanceState<object & import("@soxa-ui/core").TTagsCollectionFacade> & object;
+};

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

@@ -0,0 +1,26 @@
+"use client";
+import { useAdapter, useCollectionAdapter } from "../../adapter/runtime/useAdapter.js";
+import { useAdapterContext } from "../../adapter/runtime/useAdapterContext.js";
+import { TCollectionExtension, TagsCollectionDescriptor, TagsDescriptor } from "@soxa-ui/setup";
+//#region src/components/tags/setup.component.ts
+function useSetupTags(props) {
+	const { contexts: [adapter, collectionAdapter], layer } = useAdapterContext((create, elevator) => {
+		const adapter = create(TagsDescriptor(), {
+			ctrl: props.ctrl,
+			props
+		});
+		return [adapter, create(TagsCollectionDescriptor(), {
+			props,
+			options: {
+				owner: adapter.instance,
+				engine: props.engine
+			}
+		}, { bundle: adapter.bundle }).use(TCollectionExtension, { elevator })];
+	});
+	return {
+		...useCollectionAdapter(useAdapter(adapter, props), collectionAdapter, props),
+		layer
+	};
+}
+//#endregion
+export { useSetupTags };

package/dist/components/textable/base.component.d.ts

@@ -0,0 +1,5 @@
+import type { ITextable } from '@soxa-ui/core';
+import type { TextableDescriptor } from '@soxa-ui/setup';
+import type { EventProps, UseProps } from '../../types';
+export type TextableEventProps = EventProps<typeof TextableDescriptor>;
+export type TextableProps = UseProps<typeof TextableDescriptor, ITextable, TextableEventProps>;

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

@@ -0,0 +1 @@
+export * from './base.component';

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

@@ -0,0 +1,22 @@
+import type { TextableProps } from './base.component';
+export declare function useSetupTextable(props: TextableProps): import("../../adapter").TComponentBinding<import("@soxa-ui/setup").TContextContract<import("@soxa-ui/core").ITextable<import("@soxa-ui/core").ITextableProps, import("@soxa-ui/core").TTextableEvents>, {
+    props: object & {} & {} & {} & {
+        aria_label?: string | undefined;
+        aria_labelledBy?: string | undefined;
+        aria_describedBy?: string | undefined;
+    };
+    events: object & {
+        "element:removed": () => void;
+        "element:ready": (element: Element) => 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 & {} & {} & {} & {};
+}>, TextableProps>;

package/dist/components/textarea/Textarea.d.ts

@@ -0,0 +1,4 @@
+import type { ReactElement } from 'react';
+import type { TextareaProps } from './base.component';
+/** Textarea — многострочное поле со счётчиком символов: AGENTS.md (React), «Поля ввода». */
+export declare function Textarea(props: TextareaProps): ReactElement | null;

package/dist/components/textarea/Textarea.js

@@ -0,0 +1,35 @@
+"use client";
+import { toAriaProps } from "../../adapter/common/aria.js";
+import { toControlAttrs, toRootForward, toRootProps } from "../../adapter/common/root.js";
+import { NativeTextarea } from "../../adapter/runtime/NativeTextarea.js";
+import { useSetupTextarea } from "./setup.component.js";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/components/textarea/Textarea.tsx
+/** Textarea — многострочное поле со счётчиком символов: AGENTS.md (React), «Поля ввода». */
+function Textarea(props) {
+	const { ref, forwardProps, state } = useSetupTextarea(props);
+	const { rendered, tag, attrs, aria, dataset, id, value, name, rows, maxlength, disabled, readonly, required, placeholder, counter, counterAria, names_counter } = state;
+	if (!rendered) return null;
+	return /* @__PURE__ */ jsxs(tag, {
+		...toRootProps(ref, state, [attrs, dataset], toRootForward(forwardProps)),
+		children: [/* @__PURE__ */ jsx(NativeTextarea, {
+			id,
+			name,
+			rows,
+			maxLength: maxlength,
+			disabled,
+			readOnly: readonly,
+			required,
+			placeholder,
+			...toAriaProps(aria),
+			...toControlAttrs(forwardProps),
+			text: value
+		}), counter === true ? /* @__PURE__ */ jsx("div", {
+			className: "so-textarea__counter",
+			...toAriaProps(counterAria),
+			children: names_counter
+		}) : null]
+	});
+}
+//#endregion
+export { Textarea };

package/dist/components/textarea/base.component.d.ts

@@ -0,0 +1,7 @@
+import type { ITextarea } from '@soxa-ui/core';
+import type { TextareaDescriptor } from '@soxa-ui/setup';
+import type { EventProps, TDomAttributes, TTextareaAttributes, UseDomProps } from '../../types';
+export type TextareaEventProps = EventProps<typeof TextareaDescriptor>;
+/** Атрибуты Textarea: класс и стиль — корню, остальное — полю `<textarea>`. */
+export type TextareaAttributes = TDomAttributes<typeof TextareaDescriptor, TTextareaAttributes>;
+export type TextareaProps = UseDomProps<typeof TextareaDescriptor, ITextarea, TextareaEventProps, TTextareaAttributes>;

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

@@ -0,0 +1,2 @@
+export * from './base.component';
+export { Textarea } from './Textarea';