@pgcorp/ui-kit 0.14.0 → 0.15.0

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

@@ -6,7 +6,7 @@ import { useBinaryInput as o } from "../../../internal/useBinaryInput.js";
 import s from "./SField.vue.js";
 import { computed as c, createBlock as l, createElementVNode as u, defineComponent as d, mergeProps as f, openBlock as p, resolveDynamicComponent as m, unref as h, withCtx as g, withModifiers as _ } from "vue";
 //#region src/components/shared/controls/SCheckbox.vue?vue&type=script&setup=true&lang.ts
-var v = { class: "s-checkbox-control" }, y = [
+var v = ["data-presentation"], y = [
 	"id",
 	"checked",
 	"disabled",
@@ -14,7 +14,10 @@ var v = { class: "s-checkbox-control" }, y = [
 	"aria-invalid",
 	"aria-readonly",
 	"aria-describedby"
-], b = { class: "s-checkbox-box" }, x = /*@__PURE__*/ d({
+], b = {
+	class: "s-checkbox-box",
+	"aria-hidden": "true"
+}, x = /*@__PURE__*/ d({
 	inheritAttrs: !1,
 	__name: "SCheckbox",
 	props: {
@@ -59,7 +62,7 @@ var v = { class: "s-checkbox-control" }, y = [
 			indeterminate: () => S.indeterminate,
 			emitUpdate: (e) => C("update:modelValue", e),
 			emitClick: (e) => C("click", e)
-		});
+		}), j = c(() => S.indeterminate && !E.value);
 		return (n, i) => (p(), l(s, {
 			"control-id": h(D),
 			label: d.label,
@@ -72,7 +75,10 @@ var v = { class: "s-checkbox-control" }, y = [
 			layout: "inline",
 			"content-flow": T.value === "inline" ? "phrasing" : "flow"
 		}, {
-			default: g((n) => [u("span", v, [u("input", f({ ref: h(A) }, h(w).bindings(), {
+			default: g((n) => [u("span", {
+				class: "s-checkbox-control",
+				"data-presentation": T.value
+			}, [u("input", f({ ref: h(A) }, h(w).bindings(), {
 				id: n.controlId,
 				type: "checkbox",
 				class: "s-checkbox-input",
@@ -84,13 +90,13 @@ var v = { class: "s-checkbox-control" }, y = [
 				"aria-describedby": h(r)(h(w).string("aria-describedby"), n.describedBy),
 				onClick: i[0] ||= _((...e) => h(k) && h(k)(...e), ["stop"]),
 				onChange: i[1] ||= (...e) => h(O) && h(O)(...e)
-			}), null, 16, y), u("span", b, [(p(), l(m(d.indeterminate ? h(t) : h(e)), {
+			}), null, 16, y), u("span", b, [(p(), l(m(j.value ? h(t) : h(e)), {
 				class: "s-checkbox-check",
 				"aria-hidden": "true",
-				"data-sputnig-ui-icon": d.indeterminate ? "minus" : "check",
+				"data-sputnig-ui-icon": j.value ? "minus" : "check",
 				"data-sputnig-ui-icon-color-mode": "auto",
 				"data-sputnig-ui-icon-set": "classic"
-			}, null, 8, ["data-sputnig-ui-icon"]))])])]),
+			}, null, 8, ["data-sputnig-ui-icon"]))])], 8, v)]),
 			_: 1
 		}, 8, [
 			"control-id",

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

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

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

@@ -1,16 +1,17 @@
 import { registerLayer as e } from "../../../internal/layerStack.js";
 import { useOverlayAdmission as t } from "../../../internal/overlayHost.js";
 import { validateBoolean as n, validateDomId as ee, validateExactString as r, validateNonEmptyString as i } from "../../../internal/runtimeContract.js";
-import { useFloatingPosition as te } from "../../../composables/useFloatingPosition.js";
+import { useOverlayPortalTarget as te } from "../../../internal/overlayPortal.js";
+import { useFloatingPosition as a } from "../../../composables/useFloatingPosition.js";
 import { useUiKitLocale as ne } from "../../../composables/useUiKitLocale.js";
-import { useOwnedAttrs as a } from "../../../internal/ownedAttrs.js";
+import { useOwnedAttrs as re } from "../../../internal/ownedAttrs.js";
 import { selectionKeyToken as o } from "../_internal/useSelectionRoving.js";
 import { isSelectionModelList as s, resolveSelectionInventory as c, validateOptionalSelectionString as l, validateSelectionModel as u } from "../_internal/selectionContract.js";
 import d from "./SListbox.vue.js";
-import re from "./SInputText.vue.js";
-import { Fragment as ie, Teleport as ae, computed as f, createBlock as oe, createCommentVNode as p, createElementBlock as m, createElementVNode as h, createVNode as g, defineComponent as _, mergeProps as v, nextTick as y, normalizeStyle as se, onBeforeUnmount as ce, openBlock as b, shallowRef as x, unref as S, useId as C, watch as w, watchEffect as T } from "vue";
+import ie from "./SInputText.vue.js";
+import { Fragment as ae, Teleport as oe, computed as f, createBlock as se, createCommentVNode as p, createElementBlock as m, createElementVNode as h, createVNode as g, defineComponent as _, mergeProps as ce, nextTick as v, normalizeStyle as le, onBeforeUnmount as ue, openBlock as y, shallowRef as b, unref as x, useId as S, watch as C, watchEffect as de } from "vue";
 //#region src/components/shared/controls/SCombobox.vue?vue&type=script&setup=true&lang.ts
-var E = /*@__PURE__*/ _({
+var w = /*@__PURE__*/ _({
 	inheritAttrs: !1,
 	__name: "SCombobox",
 	props: {
@@ -47,35 +48,35 @@ var E = /*@__PURE__*/ _({
 		}
 	},
 	emits: ["update:modelValue", "update:search"],
-	setup(_, { emit: E }) {
-		let D = _, { t: O } = ne(), k = E, A = a({
+	setup(_, { emit: w }) {
+		let T = _, { t: E } = ne(), D = w, O = re({
 			component: "SCombobox",
 			owner: "editable combobox input"
-		}), le = C(), j = x(null), M = x(null), N = x(!1), P = t(), F = x(null), I = x("var(--s-layer-root-floating)"), L = null, R = 0, z = f(() => D.id === void 0 ? `s-combobox-${le}` : ee("SCombobox", "id", D.id)), B = f(() => `${z.value}-listbox`), V = f(() => {
-			if (typeof D.search != "string") throw TypeError("SCombobox: search must be a string");
-			return D.search;
+		}), k = S(), A = b(null), j = b(null), M = b(!1), N = t(), P = te(), F = b(null), I = b("var(--s-layer-root-floating)"), L = null, R = 0, z = f(() => T.id === void 0 ? `s-combobox-${k}` : ee("SCombobox", "id", T.id)), B = f(() => `${z.value}-listbox`), V = f(() => {
+			if (typeof T.search != "string") throw TypeError("SCombobox: search must be a string");
+			return T.search;
 		}), H = f(() => ({
-			filterMode: r("SCombobox", "filterMode", D.filterMode, ["local", "manual"]),
-			placeholder: i("SCombobox", "placeholder", D.placeholder ?? O("forms.searchPlaceholder")),
-			disabled: n("SCombobox", "disabled", D.disabled),
-			readonly: n("SCombobox", "readonly", D.readonly),
-			required: n("SCombobox", "required", D.required),
-			invalid: n("SCombobox", "invalid", D.invalid),
-			emptyLabel: i("SCombobox", "emptyLabel", D.emptyLabel ?? O("forms.noOptions")),
-			size: r("SCombobox", "size", D.size, [
+			filterMode: r("SCombobox", "filterMode", T.filterMode, ["local", "manual"]),
+			placeholder: i("SCombobox", "placeholder", T.placeholder ?? E("forms.searchPlaceholder")),
+			disabled: n("SCombobox", "disabled", T.disabled),
+			readonly: n("SCombobox", "readonly", T.readonly),
+			required: n("SCombobox", "required", T.required),
+			invalid: n("SCombobox", "invalid", T.invalid),
+			emptyLabel: i("SCombobox", "emptyLabel", T.emptyLabel ?? E("forms.noOptions")),
+			size: r("SCombobox", "size", T.size, [
 				"sm",
 				"md",
 				"lg"
 			]),
-			allowCustomValue: n("SCombobox", "allowCustomValue", D.allowCustomValue),
-			label: l("SCombobox", "label", D.label),
-			helpText: l("SCombobox", "helpText", D.helpText),
-			errorMessage: l("SCombobox", "errorMessage", D.errorMessage)
+			allowCustomValue: n("SCombobox", "allowCustomValue", T.allowCustomValue),
+			label: l("SCombobox", "label", T.label),
+			helpText: l("SCombobox", "helpText", T.helpText),
+			errorMessage: l("SCombobox", "errorMessage", T.errorMessage)
 		})), U = f(() => {
-			let e = c("SCombobox", D.options);
-			return H.value.allowCustomValue && typeof D.modelValue == "string" ? o("SCombobox", D.modelValue, "modelValue") : u("SCombobox", "single", D.modelValue, e), e;
+			let e = c("SCombobox", T.options);
+			return H.value.allowCustomValue && typeof T.modelValue == "string" ? o("SCombobox", T.modelValue, "modelValue") : u("SCombobox", "single", T.modelValue, e), e;
 		});
-		T(() => {
+		de(() => {
 			U.value;
 		});
 		function W(e) {
@@ -98,82 +99,88 @@ var E = /*@__PURE__*/ _({
 					options: n.map((e) => e.option)
 				}];
 			});
-		}), K = f(() => c("SCombobox filtered options", G.value)), ue = f(() => {
-			if (D.modelValue === null) return null;
-			let e = o("SCombobox", D.modelValue, "modelValue");
-			return K.value.optionsByToken.has(e) ? D.modelValue : null;
-		}), de = f(() => {
-			let e = A.bindings()["aria-label"];
+		}), K = f(() => c("SCombobox filtered options", G.value)), fe = f(() => {
+			if (T.modelValue === null) return null;
+			let e = o("SCombobox", T.modelValue, "modelValue");
+			return K.value.optionsByToken.has(e) ? T.modelValue : null;
+		}), pe = f(() => {
+			let e = O.bindings()["aria-label"];
 			return typeof e == "string" ? i("SCombobox", "aria-label", e) : H.value.label ?? H.value.placeholder;
-		}), fe = f(() => {
-			if (!N.value || F.value === null) return;
+		}), me = f(() => {
+			if (!M.value || F.value === null) return;
 			let e = o("SCombobox", F.value, "activeValue");
 			if (K.value.optionsByToken.has(e)) return `${B.value}-option-${encodeURIComponent(e)}`;
 		});
-		w(V, () => {
-			F.value = null, N.value && $();
-		}, { flush: "sync" }), w(P, (e) => {
-			e || Z("retire");
+		C(V, () => {
+			$(), M.value && Q();
+		}, { flush: "sync" }), C(N, (e) => {
+			e || X("retire");
+		}, { flush: "sync" }), C(P, (e) => {
+			e === null && X("retire");
 		}, { flush: "sync" });
-		let { anchorRef: q, panelRef: J, floatingStyle: pe } = te({
-			active: N,
+		let { anchorRef: q, panelRef: J, floatingStyle: he } = a({
+			active: M,
 			placement: () => "bottom-start",
 			widthMatch: () => "exact",
 			zIndex: () => I.value
 		});
-		function Y() {
+		function ge() {
 			if (!H.value.allowCustomValue) return null;
 			let e = V.value.trim();
 			if (e.length === 0) return null;
-			if (D.modelValue !== null) {
-				let t = o("SCombobox", D.modelValue, "modelValue");
-				if (U.value.optionsByToken.get(t)?.option.label.trim() === e || typeof D.modelValue == "string" && D.modelValue === e) return null;
+			if (T.modelValue !== null) {
+				let t = o("SCombobox", T.modelValue, "modelValue");
+				if (U.value.optionsByToken.get(t)?.option.label.trim() === e || typeof T.modelValue == "string" && T.modelValue === e) return null;
 			}
 			return e;
 		}
-		function X() {
-			let e = Y();
-			return e !== null && (k("update:modelValue", e), k("update:search", String(e)), !0);
+		function Y() {
+			let e = ge();
+			return e !== null && (D("update:modelValue", e), D("update:search", String(e)), !0);
 		}
-		function me() {
-			let e = j.value;
+		function _e() {
+			let e = A.value;
 			if (!e) throw Error("SCombobox: SInputText API is unavailable");
 			return e.getElement();
 		}
-		function Z(e) {
-			R += 1, N.value && ((e === "tab" || e === "outside") && X(), N.value = !1, F.value = null, L?.unregister({ restoreFocus: !1 }), L = null, I.value = "var(--s-layer-root-floating)");
+		function X(e) {
+			R += 1, M.value && ((e === "tab" || e === "outside") && Y(), M.value = !1, F.value = null, L?.unregister({ restoreFocus: !1 }), L = null, I.value = "var(--s-layer-root-floating)");
 		}
-		async function Q() {
-			if (U.value, H.value.disabled || H.value.readonly || N.value || !P.value) return;
-			let t = me(), n = ++R;
-			N.value = !0, L = e({
+		async function Z() {
+			if (U.value, H.value.disabled || H.value.readonly || M.value || !N.value || P.value === null) return;
+			let t = _e(), n = ++R;
+			M.value = !0, L = e({
 				kind: "listbox",
 				root: () => J.value,
 				anchor: () => q.value,
 				restoreTarget: t,
-				requestDismiss: (e) => Z(e === "escape" ? "escape" : "outside"),
-				onRetire: () => Z("retire")
-			}), I.value = L.zIndex, await y(), N.value && P.value && R === n && M.value?.initializeActive();
+				requestDismiss: (e) => X(e === "escape" ? "escape" : "outside"),
+				onRetire: () => X("retire")
+			}), I.value = L.zIndex, await v(), M.value && N.value && R === n && j.value?.initializeActive();
 		}
-		function $() {
+		C(J, () => L?.refreshModality(), { flush: "sync" });
+		function Q() {
 			let e = R;
-			y(() => {
-				N.value && P.value && R === e && M.value?.initializeActive();
+			v(() => {
+				M.value && N.value && R === e && j.value?.initializeActive();
 			});
 		}
-		function he(e) {
-			k("update:search", e), F.value = null, N.value ? $() : Q();
+		function $() {
+			j.value?.resetActive(), F.value = null;
+		}
+		function ve(e) {
+			$(), D("update:search", e), M.value ? Q() : Z();
 		}
-		function ge(e) {
+		function ye(e) {
 			if (s(e)) throw TypeError("SCombobox: selection update must be a single key or null");
-			if (u("SCombobox update", "single", e, U.value), k("update:modelValue", e), e !== null) {
+			if (u("SCombobox update", "single", e, U.value), D("update:modelValue", e), e !== null) {
 				let t = o("SCombobox", e, "selected value"), n = U.value.optionsByToken.get(t);
 				if (!n) throw Error("SCombobox: selected option identity is stale");
-				k("update:search", n.option.label);
+				D("update:search", n.option.label);
 			}
-			Z("selection");
+			X("selection");
 		}
-		async function _e(e) {
+		async function be(e) {
 			let t = {
 				ArrowDown: "next",
 				ArrowUp: "previous",
@@ -181,32 +188,32 @@ var E = /*@__PURE__*/ _({
 				End: "last"
 			}[e.key];
 			if (t) {
-				if (e.preventDefault(), N.value && M.value !== null) {
-					M.value.moveActive(t);
+				if (e.preventDefault(), M.value && j.value !== null) {
+					j.value.moveActive(t);
 					return;
 				}
-				if (await Q(), await y(), !N.value || !P.value || t === "next" || t === "previous") return;
-				M.value?.moveActive(t);
+				if (await Z(), await v(), !M.value || !N.value || t === "next" || t === "previous") return;
+				j.value?.moveActive(t);
 				return;
 			}
-			if (e.key === "Enter" && N.value) {
-				e.preventDefault(), F.value === null ? X() && Z("selection") : M.value?.selectActive();
+			if (e.key === "Enter" && M.value) {
+				e.preventDefault(), F.value === null ? Y() && X("selection") : j.value?.selectActive();
 				return;
 			}
-			if (e.key === "Escape" && N.value) {
-				e.preventDefault(), Z("escape");
+			if (e.key === "Escape" && M.value) {
+				e.preventDefault(), X("escape");
 				return;
 			}
-			e.key === "Tab" && Z("tab");
+			e.key === "Tab" && X("tab");
 		}
-		return ce(() => Z("retire")), (e, t) => (b(), m(ie, null, [h("div", {
+		return ue(() => X("retire")), (e, t) => (y(), m(ae, null, [h("div", {
 			ref_key: "anchorRef",
 			ref: q,
 			class: "s-combobox-anchor"
-		}, [g(re, v({
+		}, [g(ie, ce({
 			ref_key: "inputRef",
-			ref: j
-		}, S(A).bindings(), {
+			ref: A
+		}, x(O).bindings(), {
 			id: z.value,
 			"model-value": V.value,
 			label: _.label,
@@ -223,13 +230,13 @@ var E = /*@__PURE__*/ _({
 			role: "combobox",
 			"aria-haspopup": "listbox",
 			"aria-autocomplete": "list",
-			"aria-expanded": N.value,
+			"aria-expanded": M.value,
 			"aria-controls": B.value,
-			"aria-activedescendant": fe.value,
-			"onUpdate:modelValue": he,
-			onFocus: Q,
-			onClick: Q,
-			onKeydown: _e
+			"aria-activedescendant": me.value,
+			"onUpdate:modelValue": ve,
+			onFocus: Z,
+			onClick: Z,
+			onKeydown: be
 		}), null, 16, [
 			"id",
 			"model-value",
@@ -245,26 +252,29 @@ var E = /*@__PURE__*/ _({
 			"aria-expanded",
 			"aria-controls",
 			"aria-activedescendant"
-		])], 512), (b(), oe(ae, { to: "body" }, [N.value && S(P) ? (b(), m("div", {
+		])], 512), x(P) ? (y(), se(oe, {
+			key: 0,
+			to: x(P)
+		}, [M.value && x(N) ? (y(), m("div", {
 			key: 0,
 			ref_key: "panelRef",
 			ref: J,
-			style: se(S(pe)),
+			style: le(x(he)),
 			class: "s-combobox-layer"
 		}, [g(d, {
 			ref_key: "listboxRef",
-			ref: M,
+			ref: j,
 			id: B.value,
-			"model-value": ue.value,
+			"model-value": fe.value,
 			options: G.value,
-			label: de.value,
+			label: pe.value,
 			disabled: _.disabled,
 			readonly: _.readonly,
 			invalid: _.invalid,
 			"empty-label": H.value.emptyLabel,
 			"focus-mode": "activedescendant",
 			"active-value": F.value,
-			"onUpdate:modelValue": ge,
+			"onUpdate:modelValue": ye,
 			"onUpdate:activeValue": t[0] ||= (e) => F.value = e
 		}, null, 8, [
 			"id",
@@ -276,8 +286,8 @@ var E = /*@__PURE__*/ _({
 			"invalid",
 			"empty-label",
 			"active-value"
-		])], 4)) : p("", !0)]))], 64));
+		])], 4)) : p("", !0)], 8, ["to"])) : p("", !0)], 64));
 	}
 });
 //#endregion
-export { E as default };
+export { w as default };

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

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