@pgcorp/ui-kit 0.12.0 → 0.14.0

package/dist/src/components/shared/controls/SSelect.vue.js

@@ -1,8 +1,8 @@
-import "../../../../assets/src/components/shared/controls/SSelect.css_vue_type_style_index_0_src_441648c9_scoped_441648c9_lang.css";
+import "../../../../assets/src/components/shared/controls/SSelect.css_vue_type_style_index_0_src_df3d6688_scoped_df3d6688_lang.css";
 import e from "../../../../_virtual/_plugin-vue_export-helper.js";
 import t from "./SSelect.vue_vue_type_script_setup_true_lang.js";
 /* empty css                                                                     */
 //#region src/components/shared/controls/SSelect.vue
-var n = /*#__PURE__*/ e(t, [["__scopeId", "data-v-441648c9"]]);
+var n = /*#__PURE__*/ e(t, [["__scopeId", "data-v-df3d6688"]]);
 //#endregion
 export { n as default };

package/dist/src/components/shared/controls/SSelect.vue_vue_type_script_setup_true_lang.js

@@ -1,16 +1,17 @@
 import { findRelativeTabTarget as e } from "../../../internal/focusNavigation.js";
 import { registerLayer as t } from "../../../internal/layerStack.js";
-import { useFloatingPosition as n } from "../../../composables/useFloatingPosition.js";
-import { useUiKitLocale as r } from "../../../composables/useUiKitLocale.js";
-import { mergeIdReferences as i, useOwnedAttrs as a } from "../../../internal/ownedAttrs.js";
-import { validateBoolean as o, validateDomId as ee, validateExactString as s, validateNonEmptyString as c } from "../../../internal/runtimeContract.js";
-import l from "./SField.vue.js";
-import { isSelectionModelList as u, resolveSelectionInventory as te, validateOptionalSelectionString as d, validateSelectionMarker as f, validateSelectionModel as p } from "../_internal/selectionContract.js";
-import m from "./SComboboxTrigger.vue.js";
-import h from "./SListbox.vue.js";
-import { Teleport as g, computed as _, createBlock as v, createCommentVNode as ne, createElementBlock as re, createElementVNode as y, createVNode as b, defineComponent as x, mergeProps as S, nextTick as C, normalizeStyle as ie, onBeforeUnmount as w, openBlock as T, ref as E, unref as D, useId as ae, withCtx as oe } from "vue";
+import { useOverlayAdmission as n } from "../../../internal/overlayHost.js";
+import { validateBoolean as r, validateDomId as i, validateExactString as a, validateNonEmptyString as o } from "../../../internal/runtimeContract.js";
+import { useFloatingPosition as s } from "../../../composables/useFloatingPosition.js";
+import { useUiKitLocale as ee } from "../../../composables/useUiKitLocale.js";
+import { mergeIdReferences as te, useOwnedAttrs as ne } from "../../../internal/ownedAttrs.js";
+import c from "./SField.vue.js";
+import { isSelectionModelList as l, resolveSelectionInventory as u, validateOptionalSelectionString as d, validateSelectionMarker as re, validateSelectionModel as f } from "../_internal/selectionContract.js";
+import ie from "./SComboboxTrigger.vue.js";
+import ae from "./SListbox.vue.js";
+import { Teleport as oe, computed as p, createBlock as m, createCommentVNode as h, createElementBlock as g, createElementVNode as _, createVNode as v, defineComponent as y, mergeProps as b, nextTick as x, normalizeStyle as se, onBeforeUnmount as ce, openBlock as S, ref as C, unref as w, useId as le, watch as ue, withCtx as de } from "vue";
 //#region src/components/shared/controls/SSelect.vue?vue&type=script&setup=true&lang.ts
-var O = /*@__PURE__*/ x({
+var T = /*@__PURE__*/ y({
 	inheritAttrs: !1,
 	__name: "SSelect",
 	props: {
@@ -46,149 +47,158 @@ var O = /*@__PURE__*/ x({
 		modelValue: {}
 	},
 	emits: ["update:modelValue"],
-	setup(x, { emit: O }) {
-		let k = x, { t: A } = r(), j = O, M = a({
+	setup(y, { emit: T }) {
+		let E = y, { t: fe } = ee(), D = T, O = ne({
 			component: "SSelect",
 			owner: "combobox trigger"
-		}), N = _(() => M.bindings()), P = ae(), F = _(() => {
-			let e = s("SSelect", "selectionMode", k.selectionMode ?? "single", ["single", "multiple"]), t;
-			if (k.emptyOptionLabel !== void 0) {
+		}), k = p(() => O.bindings()), A = le(), j = p(() => {
+			let e = a("SSelect", "selectionMode", E.selectionMode ?? "single", ["single", "multiple"]), t;
+			if (E.emptyOptionLabel !== void 0) {
 				if (e === "multiple") throw Error("SSelect: emptyOptionLabel is available only in single selection mode");
-				t = c("SSelect", "emptyOptionLabel", k.emptyOptionLabel);
+				t = o("SSelect", "emptyOptionLabel", E.emptyOptionLabel);
 			}
 			return {
-				inputId: k.id === void 0 ? `s-select-${P}` : ee("SSelect", "id", k.id),
-				label: k.label === void 0 ? void 0 : c("SSelect", "label", k.label),
-				placeholder: c("SSelect", "placeholder", k.placeholder ?? A("forms.selectPlaceholder")),
-				disabled: o("SSelect", "disabled", k.disabled),
-				readonly: o("SSelect", "readonly", k.readonly),
-				required: o("SSelect", "required", k.required),
-				invalid: o("SSelect", "invalid", k.invalid),
-				errorMessage: d("SSelect", "errorMessage", k.errorMessage),
-				helpText: d("SSelect", "helpText", k.helpText),
-				size: s("SSelect", "size", k.size, [
+				inputId: E.id === void 0 ? `s-select-${A}` : i("SSelect", "id", E.id),
+				label: E.label === void 0 ? void 0 : o("SSelect", "label", E.label),
+				placeholder: o("SSelect", "placeholder", E.placeholder ?? fe("forms.selectPlaceholder")),
+				disabled: r("SSelect", "disabled", E.disabled),
+				readonly: r("SSelect", "readonly", E.readonly),
+				required: r("SSelect", "required", E.required),
+				invalid: r("SSelect", "invalid", E.invalid),
+				errorMessage: d("SSelect", "errorMessage", E.errorMessage),
+				helpText: d("SSelect", "helpText", E.helpText),
+				size: a("SSelect", "size", E.size, [
 					"xs",
 					"sm",
 					"md"
 				]),
-				appearance: s("SSelect", "appearance", k.appearance, ["field", "swatch"]),
-				align: s("SSelect", "align", k.align, [
+				appearance: a("SSelect", "appearance", E.appearance, ["field", "swatch"]),
+				align: a("SSelect", "align", E.align, [
 					"left",
 					"right",
 					"center"
 				]),
-				triggerMarker: f("SSelect", "triggerMarker", k.triggerMarker),
-				title: d("SSelect", "title", k.title),
+				triggerMarker: re("SSelect", "triggerMarker", E.triggerMarker),
+				title: d("SSelect", "title", E.title),
 				selectionMode: e,
 				emptyOptionLabel: t
 			};
-		}), I = _(() => `${F.value.inputId}-listbox`), L = _(() => F.value.selectionMode), R = _(() => te("SSelect", k.options)), z = _(() => p("SSelect", F.value.selectionMode, k.modelValue, R.value)), B = _(() => {
-			let e = N.value["aria-label"];
-			return e === void 0 ? F.value.label ?? F.value.placeholder : c("SSelect", "aria-label", e);
-		}), V = _(() => R.value.options.find((e) => z.value.has(e.token))?.option ?? null), H = _(() => R.value.options.filter((e) => z.value.has(e.token)).map((e) => e.option.label).join(", ")), U = _(() => F.value.emptyOptionLabel), W = _(() => {
-			let e = F.value.appearance === "swatch" ? "color" : "select", t = {
-				id: I.value,
-				label: B.value,
-				options: k.options,
+		}), M = p(() => `${j.value.inputId}-listbox`), N = p(() => j.value.selectionMode), P = p(() => u("SSelect", E.options)), F = p(() => f("SSelect", j.value.selectionMode, E.modelValue, P.value)), I = p(() => {
+			let e = k.value["aria-label"];
+			return e === void 0 ? j.value.label ?? j.value.placeholder : o("SSelect", "aria-label", e);
+		}), L = p(() => P.value.options.find((e) => F.value.has(e.token))?.option ?? null), R = p(() => P.value.options.filter((e) => F.value.has(e.token)).map((e) => e.option.label).join(", ")), z = p(() => j.value.emptyOptionLabel), B = p(() => {
+			let e = j.value.appearance === "swatch" ? "color" : "select", t = {
+				id: M.value,
+				label: I.value,
+				options: E.options,
 				variant: e,
-				invalid: F.value.invalid
+				invalid: j.value.invalid
 			};
-			if (F.value.selectionMode === "multiple") {
-				if (!u(k.modelValue)) throw TypeError("SSelect: multiple selection requires modelValue to be an array");
+			if (j.value.selectionMode === "multiple") {
+				if (!l(E.modelValue)) throw TypeError("SSelect: multiple selection requires modelValue to be an array");
 				return {
 					...t,
 					selectionMode: "multiple",
-					modelValue: k.modelValue
+					modelValue: E.modelValue
 				};
 			}
-			if (u(k.modelValue)) throw TypeError("SSelect: single selection requires modelValue to be a selection key or null");
+			if (l(E.modelValue)) throw TypeError("SSelect: single selection requires modelValue to be a selection key or null");
 			return {
 				...t,
 				selectionMode: "single",
-				modelValue: k.modelValue,
-				clearOptionLabel: F.value.emptyOptionLabel
+				modelValue: E.modelValue,
+				clearOptionLabel: j.value.emptyOptionLabel
 			};
-		}), G = E(!1), K = E("var(--s-layer-root-floating)"), q = null, J = E(null), Y = E(null), se = _(() => `bottom-${F.value.align === "left" ? "start" : F.value.align === "right" ? "end" : "center"}`), { anchorRef: X, panelRef: Z, floatingStyle: ce } = n({
-			active: G,
-			placement: () => se.value,
-			widthMatch: () => F.value.appearance === "field" ? "exact" : "none",
-			zIndex: () => K.value
-		});
-		function Q(e = "trigger") {
-			G.value && (G.value = !1, q?.unregister({ restoreFocus: e === "trigger" || e === "selection" || e === "escape" }), q = null, K.value = "var(--s-layer-root-floating)");
+		}), V = C(!1), H = n(), U = C("var(--s-layer-root-floating)"), W = null, G = C(null), K = C(null), pe = p(() => `bottom-${j.value.align === "left" ? "start" : j.value.align === "right" ? "end" : "center"}`), { anchorRef: q, panelRef: J, floatingStyle: me, updatePosition: he } = s({
+			active: V,
+			placement: () => pe.value,
+			widthMatch: () => j.value.appearance === "field" ? "exact" : "none",
+			zIndex: () => U.value
+		}), Y = null, X = 0;
+		ue(H, (e) => {
+			e || Z("outside");
+		}, { flush: "sync" });
+		function Z(e = "trigger") {
+			X += 1, e !== "tab" && (Y?.(), Y = null), V.value && (V.value = !1, W?.unregister({
+				restoreFocus: e === "trigger" || e === "selection" || e === "escape",
+				commitFocusHandoff: e === "tab"
+			}), W = null, U.value = "var(--s-layer-root-floating)");
 		}
-		function $() {
-			let e = J.value;
+		function Q() {
+			let e = G.value;
 			if (!e) throw Error("SSelect: combobox trigger API is unavailable");
 			return e.getElement();
 		}
-		function le(t) {
-			let n = $(), r = q?.focusScope() ?? document, i = e(n, r, Z.value, t.shiftKey);
-			t.preventDefault(), Q("tab"), i && C(() => i.focus());
+		function ge(t) {
+			let n = Q(), r = W?.focusScope() ?? document, i = e(n, r, J.value, t.shiftKey);
+			t.preventDefault(), Y?.(), Y = i && W ? W.handoffFocus(i) : null, Z("tab");
 		}
-		async function ue() {
-			if (z.value, U.value, F.value.disabled || F.value.readonly || G.value) return;
-			let e = $();
-			G.value = !0, q = t({
+		async function $() {
+			if (Y?.(), Y = null, F.value, z.value, j.value.disabled || j.value.readonly || V.value || !H.value) return;
+			let e = Q(), n = document.activeElement, r = ++X;
+			if (V.value = !0, W = t({
 				kind: "listbox",
-				root: () => Z.value,
-				anchor: () => X.value,
+				root: () => J.value,
+				anchor: () => q.value,
 				restoreTarget: e,
-				requestDismiss: (e) => Q(e === "escape" ? "escape" : "outside")
-			}), K.value = q.zIndex, await C(), G.value && Y.value?.focusSelectedOrFirst();
+				requestDismiss: (e) => Z(e === "escape" ? "escape" : "outside"),
+				onRetire: () => Z("outside")
+			}), U.value = W.zIndex, await x(), !V.value || X !== r || !H.value || (he(), await x(), !V.value || X !== r || !H.value)) return;
+			let i = document.activeElement, a = n instanceof HTMLElement && !n.isConnected && i === document.body;
+			(i === n || a) && K.value?.focusSelectedOrFirst();
 		}
-		function de() {
-			G.value ? Q("trigger") : ue();
+		function _e() {
+			V.value ? Z("trigger") : $();
 		}
-		function fe(e) {
-			if (L.value === "multiple") {
-				if (!u(e)) throw TypeError("SSelect: multiple selection update must be an array");
-				p("SSelect update", "multiple", e, R.value), j("update:modelValue", e);
+		function ve(e) {
+			if (N.value === "multiple") {
+				if (!l(e)) throw TypeError("SSelect: multiple selection update must be an array");
+				f("SSelect update", "multiple", e, P.value), D("update:modelValue", e);
 				return;
 			}
-			if (u(e)) throw TypeError("SSelect: single selection update must be a selection key or null");
-			p("SSelect update", "single", e, R.value), j("update:modelValue", e), Q("selection");
+			if (l(e)) throw TypeError("SSelect: single selection update must be a selection key or null");
+			f("SSelect update", "single", e, P.value), D("update:modelValue", e), Z("selection");
 		}
-		return w(() => {
-			q?.unregister({ restoreFocus: !1 }), q = null;
-		}), (e, t) => (T(), v(l, {
-			"control-id": F.value.inputId,
-			label: F.value.label,
-			required: F.value.required,
-			"help-text": F.value.helpText,
-			"error-message": F.value.errorMessage,
-			invalid: F.value.invalid,
-			disabled: F.value.disabled,
-			readonly: F.value.readonly
+		return ce(() => {
+			X += 1, Y?.(), W?.unregister({ restoreFocus: !1 }), W = null;
+		}), (e, t) => (S(), m(c, {
+			"control-id": j.value.inputId,
+			label: j.value.label,
+			required: j.value.required,
+			"help-text": j.value.helpText,
+			"error-message": j.value.errorMessage,
+			invalid: j.value.invalid,
+			disabled: j.value.disabled,
+			readonly: j.value.readonly
 		}, {
-			default: oe((e) => [y("div", {
+			default: de((e) => [_("div", {
 				ref_key: "anchorRef",
-				ref: X,
+				ref: q,
 				class: "s-select-anchor"
-			}, [b(m, {
+			}, [v(ie, {
 				ref_key: "triggerRef",
-				ref: J,
+				ref: G,
 				id: e.controlId,
-				title: F.value.title,
-				"accessible-label": B.value,
-				expanded: G.value,
-				controls: I.value,
-				"display-value": H.value,
-				placeholder: F.value.placeholder,
-				marker: F.value.triggerMarker ?? V.value?.marker,
-				size: F.value.size,
+				title: j.value.title,
+				"accessible-label": I.value,
+				expanded: V.value,
+				controls: M.value,
+				"display-value": R.value,
+				placeholder: j.value.placeholder,
+				marker: j.value.triggerMarker ?? L.value?.marker,
+				size: j.value.size,
 				disabled: e.disabled,
 				invalid: e.invalid,
-				"described-by": D(i)(N.value["aria-describedby"], e.describedBy),
+				"described-by": w(te)(k.value["aria-describedby"], e.describedBy),
 				required: e.required,
 				readonly: e.readonly,
-				"test-id": N.value["data-testid"],
-				test: N.value["data-test"],
-				"task-mapping-internal-value": N.value["data-task-mapping-internal-value"],
-				"task-mapping-kind": N.value["data-task-mapping-kind"],
-				appearance: F.value.appearance,
-				width: F.value.appearance === "swatch" ? "auto" : "full",
-				onToggle: de
+				"test-id": k.value["data-testid"],
+				test: k.value["data-test"],
+				"task-mapping-internal-value": k.value["data-task-mapping-internal-value"],
+				"task-mapping-kind": k.value["data-task-mapping-kind"],
+				appearance: j.value.appearance,
+				width: j.value.appearance === "swatch" ? "auto" : "full",
+				onToggle: _e
 			}, null, 8, [
 				"id",
 				"title",
@@ -210,20 +220,20 @@ var O = /*@__PURE__*/ x({
 				"task-mapping-kind",
 				"appearance",
 				"width"
-			])], 512), (T(), v(g, { to: "body" }, [G.value ? (T(), re("div", {
+			])], 512), (S(), m(oe, { to: "body" }, [V.value && w(H) ? (S(), g("div", {
 				key: 0,
 				ref_key: "panelRef",
-				ref: Z,
-				style: ie(D(ce)),
+				ref: J,
+				style: se(w(me)),
 				class: "s-select-layer"
-			}, [b(h, S({
+			}, [v(ae, b({
 				ref_key: "listboxRef",
-				ref: Y
-			}, W.value, {
-				"onUpdate:modelValue": fe,
-				onEscape: t[0] ||= (e) => Q("escape"),
-				onTab: le
-			}), null, 16)], 4)) : ne("", !0)]))]),
+				ref: K
+			}, B.value, {
+				"onUpdate:modelValue": ve,
+				onEscape: t[0] ||= (e) => Z("escape"),
+				onTab: ge
+			}), null, 16)], 4)) : h("", !0)]))]),
 			_: 1
 		}, 8, [
 			"control-id",
@@ -238,4 +248,4 @@ var O = /*@__PURE__*/ x({
 	}
 });
 //#endregion
-export { O as default };
+export { T as default };

package/dist/src/components/shared/controls/STextarea.d.ts

@@ -1 +1 @@
-export type { Props as STextareaProps, STextareaApi, STextareaAppearance, STextareaAutocomplete, STextareaSuggestionPopupRole, STextareaSuggestions, STextareaReplaceOptions, STextareaResizeContract, STextareaSelection, STextareaSelectionDirection, STextareaSize, STextareaState, } from './STextarea.vue';
+export type { Props as STextareaProps, STextareaApi, STextareaAppearance, STextareaAutocomplete, STextareaContentContext, STextareaSuggestionPopupRole, STextareaSuggestions, STextareaReplaceOptions, STextareaResizeContract, STextareaSelection, STextareaSelectionDirection, STextareaSize, STextareaState, } from './STextarea.vue';

package/dist/src/components/shared/controls/STextarea.vue.d.ts

@@ -1,3 +1,4 @@
+import { VNodeChild } from 'vue';
 /** Визуальная интеграция native textarea с SField. / Native textarea visual integration with SField. */
 export type STextareaAppearance = 'default' | 'ghost';
 export type STextareaSize = 'sm' | 'md' | 'lg';
@@ -13,6 +14,8 @@ export interface STextareaSelection {
 /** Связь multiline textbox с consumer-owned suggestion popup без недопустимого role="combobox" на textarea. */
 export interface STextareaSuggestions {
     controls: string;
+    /** Explicit popup participation; inactive suggestions cannot declare an active descendant. */
+    active?: boolean;
     activeDescendant?: string;
     autocomplete?: STextareaAutocomplete;
     popupRole?: STextareaSuggestionPopupRole;
@@ -23,6 +26,17 @@ export interface STextareaState {
     selection: STextareaSelection;
     composing: boolean;
 }
+/** In-flow composer slots share the native editing owner's state and focus method. */
+export interface STextareaContentContext {
+    empty: boolean;
+    disabled: boolean;
+    readonly: boolean;
+    invalid: boolean;
+    composing: boolean;
+    /** Native editable text wrapping; null means a measurable layout is unavailable. */
+    hasMultipleVisualLines: boolean | null;
+    focus(): void;
+}
 export interface STextareaReplaceOptions {
     selection?: STextareaSelection;
     selectionMode?: SelectionMode;
@@ -36,6 +50,8 @@ export interface STextareaApi {
     insertSoftLineBreak(): void;
     replaceSelection(text: string, options?: STextareaReplaceOptions): STextareaState;
     resize(): void;
+    /** Select the current native API value without editing the source model. Focus defaults to true and follows native eligibility; readonly and detached controls remain selectable. Unavailable/disposed owners and non-boolean focus policies throw. */
+    selectAll(focusOwner?: boolean): void;
     setSelection(selection: STextareaSelection, focusOwner?: boolean): void;
     setSelectionOffset(offset: number): void;
 }
@@ -65,6 +81,8 @@ export interface Props {
     helpText?: string;
     id?: string;
     rows?: number;
+    minLength?: number;
+    maxLength?: number;
     size?: STextareaSize;
     autoResize?: boolean;
     maxRows?: number;
@@ -74,7 +92,11 @@ export interface Props {
     appearance?: STextareaAppearance;
     monospace?: boolean;
 }
-declare const __VLS_export: import('vue').DefineComponent<Props, STextareaApi, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {} & {
+type __VLS_Slots = {
+    'empty-content'?: (context: STextareaContentContext) => VNodeChild;
+    'helper-content'?: (context: STextareaContentContext) => VNodeChild;
+};
+declare const __VLS_base: import('vue').DefineComponent<Props, STextareaApi, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {} & {
     blur: (focusEvent: FocusEvent) => any;
     click: (mouseEvent: MouseEvent) => any;
     compositionend: (compositionEvent: CompositionEvent) => any;
@@ -106,7 +128,6 @@ declare const __VLS_export: import('vue').DefineComponent<Props, STextareaApi, {
     id: string;
     invalid: boolean;
     size: STextareaSize;
-    maxHeight: number;
     placeholder: string;
     disabled: boolean;
     readonly: boolean;
@@ -115,11 +136,20 @@ declare const __VLS_export: import('vue').DefineComponent<Props, STextareaApi, {
     errorMessage: string;
     modelValue: string | null;
     appearance: STextareaAppearance;
+    maxHeight: number;
+    minLength: number;
+    maxLength: number;
     autoResize: boolean;
     maxRows: number;
     minHeight: number;
     suggestions: STextareaSuggestions;
     monospace: boolean;
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
 declare const _default: typeof __VLS_export;
 export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};