@shtabapp/ui-kit 1.84.0 → 1.85.1

package/dist/components/SToastProvider/SToastProviderToast.vue_vue_type_script_setup_true_lang.cjs

@@ -0,0 +1,75 @@
+const require_toastProviderConstants = require("./utils/toastProviderConstants.cjs");
+let vue = require("vue");
+let _vueuse_core = require("@vueuse/core");
+//#region src/components/SToastProvider/SToastProviderToast.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1 = [
+	"data-mounted",
+	"data-front",
+	"data-expanded",
+	"data-removed",
+	"data-visible"
+];
+var SToastProviderToast_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ (0, vue.defineComponent)({
+	__name: "SToastProviderToast",
+	props: {
+		index: {},
+		expanded: { type: Boolean },
+		frontToastHeight: {},
+		stackPeek: {},
+		removed: { type: Boolean },
+		visible: { type: Boolean },
+		offsetY: {}
+	},
+	emits: ["heightChange"],
+	setup(__props, { emit: __emit }) {
+		const emit = __emit;
+		const contentRef = (0, vue.ref)(null);
+		const height = (0, vue.ref)(0);
+		const isMounted = (0, vue.ref)(false);
+		const isFront = (0, vue.computed)(() => __props.index === 0);
+		const stackScale = (0, vue.computed)(() => {
+			return 1 - __props.index * require_toastProviderConstants.TOAST_STACK_SCALE_STEP;
+		});
+		const toastStyle = (0, vue.computed)(() => {
+			return {
+				"--s-ui-toast-provider-toasts-before": String(__props.index),
+				"--s-ui-toast-provider-lift-amount": `${__props.stackPeek * -1}px`,
+				"--s-ui-toast-provider-front-toast-height": `${__props.frontToastHeight}px`,
+				"--s-ui-toast-provider-offset-y": `${__props.offsetY}px`,
+				"--s-ui-toast-provider-initial-height": `${height.value}px`,
+				"--s-ui-toast-provider-stack-scale": String(stackScale.value),
+				zIndex: String(1e3 - __props.index)
+			};
+		});
+		(0, _vueuse_core.useResizeObserver)(contentRef, (entries) => {
+			const nextHeight = entries[0]?.contentRect.height ?? 0;
+			if (nextHeight === height.value) return;
+			height.value = nextHeight;
+			emit("heightChange", nextHeight);
+		});
+		(0, vue.onMounted)(() => {
+			requestAnimationFrame(() => {
+				requestAnimationFrame(() => {
+					isMounted.value = true;
+				});
+			});
+		});
+		return (_ctx, _cache) => {
+			return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
+				class: "s-ui-toast-provider__toast",
+				"data-mounted": isMounted.value,
+				"data-front": isFront.value,
+				"data-expanded": __props.expanded,
+				"data-removed": __props.removed,
+				"data-visible": __props.visible,
+				style: (0, vue.normalizeStyle)(toastStyle.value)
+			}, [(0, vue.createElementVNode)("div", {
+				ref_key: "contentRef",
+				ref: contentRef,
+				class: "s-ui-toast-provider__toast-content"
+			}, [(0, vue.renderSlot)(_ctx.$slots, "default")], 512)], 12, _hoisted_1);
+		};
+	}
+});
+//#endregion
+exports.default = SToastProviderToast_vue_vue_type_script_setup_true_lang_default;

package/dist/components/SToastProvider/SToastProviderToast.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,75 @@
+import { TOAST_STACK_SCALE_STEP } from "./utils/toastProviderConstants.js";
+import { computed, createElementBlock, createElementVNode, defineComponent, normalizeStyle, onMounted, openBlock, ref, renderSlot } from "vue";
+import { useResizeObserver } from "@vueuse/core";
+//#region src/components/SToastProvider/SToastProviderToast.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1 = [
+	"data-mounted",
+	"data-front",
+	"data-expanded",
+	"data-removed",
+	"data-visible"
+];
+var SToastProviderToast_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
+	__name: "SToastProviderToast",
+	props: {
+		index: {},
+		expanded: { type: Boolean },
+		frontToastHeight: {},
+		stackPeek: {},
+		removed: { type: Boolean },
+		visible: { type: Boolean },
+		offsetY: {}
+	},
+	emits: ["heightChange"],
+	setup(__props, { emit: __emit }) {
+		const emit = __emit;
+		const contentRef = ref(null);
+		const height = ref(0);
+		const isMounted = ref(false);
+		const isFront = computed(() => __props.index === 0);
+		const stackScale = computed(() => {
+			return 1 - __props.index * TOAST_STACK_SCALE_STEP;
+		});
+		const toastStyle = computed(() => {
+			return {
+				"--s-ui-toast-provider-toasts-before": String(__props.index),
+				"--s-ui-toast-provider-lift-amount": `${__props.stackPeek * -1}px`,
+				"--s-ui-toast-provider-front-toast-height": `${__props.frontToastHeight}px`,
+				"--s-ui-toast-provider-offset-y": `${__props.offsetY}px`,
+				"--s-ui-toast-provider-initial-height": `${height.value}px`,
+				"--s-ui-toast-provider-stack-scale": String(stackScale.value),
+				zIndex: String(1e3 - __props.index)
+			};
+		});
+		useResizeObserver(contentRef, (entries) => {
+			const nextHeight = entries[0]?.contentRect.height ?? 0;
+			if (nextHeight === height.value) return;
+			height.value = nextHeight;
+			emit("heightChange", nextHeight);
+		});
+		onMounted(() => {
+			requestAnimationFrame(() => {
+				requestAnimationFrame(() => {
+					isMounted.value = true;
+				});
+			});
+		});
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("div", {
+				class: "s-ui-toast-provider__toast",
+				"data-mounted": isMounted.value,
+				"data-front": isFront.value,
+				"data-expanded": __props.expanded,
+				"data-removed": __props.removed,
+				"data-visible": __props.visible,
+				style: normalizeStyle(toastStyle.value)
+			}, [createElementVNode("div", {
+				ref_key: "contentRef",
+				ref: contentRef,
+				class: "s-ui-toast-provider__toast-content"
+			}, [renderSlot(_ctx.$slots, "default")], 512)], 12, _hoisted_1);
+		};
+	}
+});
+//#endregion
+export { SToastProviderToast_vue_vue_type_script_setup_true_lang_default as default };

package/dist/components/SToastProvider/useToast.cjs

@@ -0,0 +1,96 @@
+const require_SNotification_types = require("../SNotification/SNotification.types.cjs");
+const require_computeAutoDuration = require("./utils/computeAutoDuration.cjs");
+//#region src/components/SToastProvider/useToast.ts
+var toastQueue = (0, require("vue").shallowRef)([]);
+var timers = /* @__PURE__ */ new Map();
+var idCounter = 0;
+var defaultToastConfig = {
+	type: require_SNotification_types.ENotificationType.INFO_ACCENT,
+	layout: require_SNotification_types.ENotificationLayout.HORIZONTAL,
+	leftside: require_SNotification_types.ENotificationLeftside.ICON,
+	showPrimaryButton: false,
+	closable: true
+};
+var generateId = () => {
+	return `toast-${Date.now()}-${++idCounter}`;
+};
+var clearTimer = (id) => {
+	const timer = timers.get(id);
+	if (timer) {
+		window.clearTimeout(timer);
+		timers.delete(id);
+	}
+};
+var scheduleAutoHide = (toast) => {
+	clearTimer(toast.id);
+	const duration = toast.duration === void 0 ? require_computeAutoDuration.computeAutoDuration(toast.title, toast.description) : toast.duration;
+	if (duration > 0) {
+		const timer = window.setTimeout(() => {
+			hide(toast.id);
+		}, duration);
+		timers.set(toast.id, timer);
+	}
+};
+var hide = (id) => {
+	const index = toastQueue.value.findIndex((toast) => toast.id === id);
+	if (index === -1) return;
+	const toast = toastQueue.value[index];
+	if (!toast) return;
+	clearTimer(id);
+	if (toast.onClose) toast.onClose();
+	toastQueue.value = toastQueue.value.filter((item) => item.id !== id);
+};
+var hideAll = () => {
+	timers.forEach((timer) => window.clearTimeout(timer));
+	timers.clear();
+	toastQueue.value = [];
+};
+var evictOverflowToasts = (queue) => {
+	if (queue.length <= 3) return queue;
+	queue.slice(3).forEach((toast) => {
+		clearTimer(toast.id);
+	});
+	return queue.slice(0, 3);
+};
+var show = (config) => {
+	const id = config.id ?? generateId();
+	const toastConfig = {
+		...defaultToastConfig,
+		...config,
+		id
+	};
+	const existingIndex = toastQueue.value.findIndex((toast) => toast.id === id);
+	if (existingIndex > -1) {
+		const nextQueue = [...toastQueue.value];
+		nextQueue[existingIndex] = toastConfig;
+		toastQueue.value = evictOverflowToasts(nextQueue);
+	} else toastQueue.value = evictOverflowToasts([toastConfig, ...toastQueue.value]);
+	scheduleAutoHide(toastConfig);
+	return id;
+};
+var update = (id, config) => {
+	const index = toastQueue.value.findIndex((toast) => toast.id === id);
+	if (index === -1) return;
+	const currentToast = toastQueue.value[index];
+	if (!currentToast) return;
+	const nextToast = {
+		...currentToast,
+		...config,
+		id: currentToast.id
+	};
+	const nextQueue = [...toastQueue.value];
+	nextQueue[index] = nextToast;
+	toastQueue.value = nextQueue;
+	scheduleAutoHide(nextToast);
+};
+var useToast = () => {
+	return {
+		toasts: toastQueue,
+		show,
+		hide,
+		hideAll,
+		update
+	};
+};
+//#endregion
+exports.useToast = useToast;

package/dist/components/SToastProvider/useToast.js

@@ -0,0 +1,97 @@
+import { ENotificationLayout, ENotificationLeftside, ENotificationType } from "../SNotification/SNotification.types.js";
+import { computeAutoDuration } from "./utils/computeAutoDuration.js";
+import { shallowRef } from "vue";
+//#region src/components/SToastProvider/useToast.ts
+var toastQueue = shallowRef([]);
+var timers = /* @__PURE__ */ new Map();
+var idCounter = 0;
+var defaultToastConfig = {
+	type: ENotificationType.INFO_ACCENT,
+	layout: ENotificationLayout.HORIZONTAL,
+	leftside: ENotificationLeftside.ICON,
+	showPrimaryButton: false,
+	closable: true
+};
+var generateId = () => {
+	return `toast-${Date.now()}-${++idCounter}`;
+};
+var clearTimer = (id) => {
+	const timer = timers.get(id);
+	if (timer) {
+		window.clearTimeout(timer);
+		timers.delete(id);
+	}
+};
+var scheduleAutoHide = (toast) => {
+	clearTimer(toast.id);
+	const duration = toast.duration === void 0 ? computeAutoDuration(toast.title, toast.description) : toast.duration;
+	if (duration > 0) {
+		const timer = window.setTimeout(() => {
+			hide(toast.id);
+		}, duration);
+		timers.set(toast.id, timer);
+	}
+};
+var hide = (id) => {
+	const index = toastQueue.value.findIndex((toast) => toast.id === id);
+	if (index === -1) return;
+	const toast = toastQueue.value[index];
+	if (!toast) return;
+	clearTimer(id);
+	if (toast.onClose) toast.onClose();
+	toastQueue.value = toastQueue.value.filter((item) => item.id !== id);
+};
+var hideAll = () => {
+	timers.forEach((timer) => window.clearTimeout(timer));
+	timers.clear();
+	toastQueue.value = [];
+};
+var evictOverflowToasts = (queue) => {
+	if (queue.length <= 3) return queue;
+	queue.slice(3).forEach((toast) => {
+		clearTimer(toast.id);
+	});
+	return queue.slice(0, 3);
+};
+var show = (config) => {
+	const id = config.id ?? generateId();
+	const toastConfig = {
+		...defaultToastConfig,
+		...config,
+		id
+	};
+	const existingIndex = toastQueue.value.findIndex((toast) => toast.id === id);
+	if (existingIndex > -1) {
+		const nextQueue = [...toastQueue.value];
+		nextQueue[existingIndex] = toastConfig;
+		toastQueue.value = evictOverflowToasts(nextQueue);
+	} else toastQueue.value = evictOverflowToasts([toastConfig, ...toastQueue.value]);
+	scheduleAutoHide(toastConfig);
+	return id;
+};
+var update = (id, config) => {
+	const index = toastQueue.value.findIndex((toast) => toast.id === id);
+	if (index === -1) return;
+	const currentToast = toastQueue.value[index];
+	if (!currentToast) return;
+	const nextToast = {
+		...currentToast,
+		...config,
+		id: currentToast.id
+	};
+	const nextQueue = [...toastQueue.value];
+	nextQueue[index] = nextToast;
+	toastQueue.value = nextQueue;
+	scheduleAutoHide(nextToast);
+};
+var useToast = () => {
+	return {
+		toasts: toastQueue,
+		show,
+		hide,
+		hideAll,
+		update
+	};
+};
+//#endregion
+export { useToast };

package/dist/components/SToastProvider/utils/computeAutoDuration.cjs

@@ -0,0 +1,14 @@
+//#region src/components/SToastProvider/utils/computeAutoDuration.ts
+var TOAST_AUTO_DURATION_MIN_MS = 4e3;
+var TOAST_AUTO_DURATION_MAX_MS = 1e4;
+var TOAST_AUTO_DURATION_MS_PER_CHAR = 50;
+var computeAutoDuration = (title, description) => {
+	const duration = TOAST_AUTO_DURATION_MIN_MS + (title.length + (description?.length ?? 0)) * 50;
+	if (duration > 1e4) return TOAST_AUTO_DURATION_MAX_MS;
+	return duration;
+};
+//#endregion
+exports.TOAST_AUTO_DURATION_MAX_MS = TOAST_AUTO_DURATION_MAX_MS;
+exports.TOAST_AUTO_DURATION_MIN_MS = TOAST_AUTO_DURATION_MIN_MS;
+exports.TOAST_AUTO_DURATION_MS_PER_CHAR = TOAST_AUTO_DURATION_MS_PER_CHAR;
+exports.computeAutoDuration = computeAutoDuration;

package/dist/components/SToastProvider/utils/computeAutoDuration.js

@@ -0,0 +1,11 @@
+//#region src/components/SToastProvider/utils/computeAutoDuration.ts
+var TOAST_AUTO_DURATION_MIN_MS = 4e3;
+var TOAST_AUTO_DURATION_MAX_MS = 1e4;
+var TOAST_AUTO_DURATION_MS_PER_CHAR = 50;
+var computeAutoDuration = (title, description) => {
+	const duration = TOAST_AUTO_DURATION_MIN_MS + (title.length + (description?.length ?? 0)) * 50;
+	if (duration > 1e4) return TOAST_AUTO_DURATION_MAX_MS;
+	return duration;
+};
+//#endregion
+export { TOAST_AUTO_DURATION_MAX_MS, TOAST_AUTO_DURATION_MIN_MS, TOAST_AUTO_DURATION_MS_PER_CHAR, computeAutoDuration };

package/dist/components/SToastProvider/utils/toastProviderConstants.cjs

@@ -0,0 +1,4 @@
+//#region src/components/SToastProvider/utils/toastProviderConstants.ts
+var TOAST_STACK_SCALE_STEP = .05;
+//#endregion
+exports.TOAST_STACK_SCALE_STEP = TOAST_STACK_SCALE_STEP;

package/dist/components/SToastProvider/utils/toastProviderConstants.js

@@ -0,0 +1,4 @@
+//#region src/components/SToastProvider/utils/toastProviderConstants.ts
+var TOAST_STACK_SCALE_STEP = .05;
+//#endregion
+export { TOAST_STACK_SCALE_STEP };

package/dist/components/SToggle/SToggle.types.cjs

@@ -0,0 +1,15 @@
+//#region src/components/SToggle/SToggle.types.ts
+var ESToggleSize = /* @__PURE__ */ function(ESToggleSize) {
+	ESToggleSize["SMALL"] = "small";
+	ESToggleSize["MEDIUM"] = "medium";
+	ESToggleSize["LARGE"] = "large";
+	return ESToggleSize;
+}({});
+var ESToggleLabelPlacement = /* @__PURE__ */ function(ESToggleLabelPlacement) {
+	ESToggleLabelPlacement["LEFT"] = "left";
+	ESToggleLabelPlacement["RIGHT"] = "right";
+	return ESToggleLabelPlacement;
+}({});
+//#endregion
+exports.ESToggleLabelPlacement = ESToggleLabelPlacement;
+exports.ESToggleSize = ESToggleSize;

package/dist/components/SToggle/SToggle.types.js

@@ -0,0 +1,14 @@
+//#region src/components/SToggle/SToggle.types.ts
+var ESToggleSize = /* @__PURE__ */ function(ESToggleSize) {
+	ESToggleSize["SMALL"] = "small";
+	ESToggleSize["MEDIUM"] = "medium";
+	ESToggleSize["LARGE"] = "large";
+	return ESToggleSize;
+}({});
+var ESToggleLabelPlacement = /* @__PURE__ */ function(ESToggleLabelPlacement) {
+	ESToggleLabelPlacement["LEFT"] = "left";
+	ESToggleLabelPlacement["RIGHT"] = "right";
+	return ESToggleLabelPlacement;
+}({});
+//#endregion
+export { ESToggleLabelPlacement, ESToggleSize };

package/dist/components/SToggle/SToggle.vue.cjs

@@ -0,0 +1,6 @@
+const require_SToggle_vue_vue_type_script_setup_true_lang = require("./SToggle.vue_vue_type_script_setup_true_lang.cjs");
+;/* empty css                                                             */
+//#region src/components/SToggle/SToggle.vue
+var SToggle_default = require_SToggle_vue_vue_type_script_setup_true_lang.default;
+//#endregion
+exports.default = SToggle_default;

package/dist/components/SToggle/SToggle.vue.js

@@ -0,0 +1,6 @@
+import SToggle_vue_vue_type_script_setup_true_lang_default from "./SToggle.vue_vue_type_script_setup_true_lang.js";
+/* empty css                                                           */
+//#region src/components/SToggle/SToggle.vue
+var SToggle_default = SToggle_vue_vue_type_script_setup_true_lang_default;
+//#endregion
+export { SToggle_default as default };

package/dist/components/SToggle/SToggle.vue_vue_type_script_setup_true_lang.cjs

@@ -0,0 +1,80 @@
+const require_useAriaAttrs = require("../../composables/useAriaAttrs.cjs");
+const require_SToggle_types = require("./SToggle.types.cjs");
+let vue = require("vue");
+//#region src/components/SToggle/SToggle.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1 = ["disabled", "name"];
+var _hoisted_2 = {
+	key: 0,
+	class: "s-ui-toggle__content"
+};
+var _hoisted_3 = {
+	key: 0,
+	class: "s-ui-toggle__label s-ui-typography-label-14-medium"
+};
+var _hoisted_4 = {
+	key: 1,
+	class: "s-ui-toggle__description s-ui-typography-body-12-regular"
+};
+var SToggle_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ (0, vue.defineComponent)({
+	inheritAttrs: false,
+	__name: "SToggle",
+	props: /*@__PURE__*/ (0, vue.mergeModels)({
+		disabled: {
+			type: Boolean,
+			default: false
+		},
+		labelPlacement: { default: () => require_SToggle_types.ESToggleLabelPlacement.RIGHT },
+		name: {},
+		size: { default: () => require_SToggle_types.ESToggleSize.LARGE }
+	}, {
+		"modelValue": {
+			type: Boolean,
+			default: false
+		},
+		"modelModifiers": {}
+	}),
+	emits: /*@__PURE__*/ (0, vue.mergeModels)(["change"], ["update:modelValue"]),
+	setup(__props, { emit: __emit }) {
+		/**
+		* Переключатель на нативном checkbox с `role="switch"`.
+		* @displayName SToggle
+		*/
+		const modelValue = (0, vue.useModel)(__props, "modelValue");
+		/** Срабатывает при изменении нативного контрола; payload — состояние checked. */
+		const emit = __emit;
+		const { getRootAttrs, getAriaAttrs } = require_useAriaAttrs.useAriaAttrs();
+		const slots = (0, vue.useSlots)();
+		const rootClasses = (0, vue.computed)(() => {
+			return [`s-ui-toggle--size-${__props.size}`, {
+				"s-ui-toggle--checked": modelValue.value,
+				"s-ui-toggle--disabled": __props.disabled,
+				"s-ui-toggle--label-left": __props.labelPlacement === require_SToggle_types.ESToggleLabelPlacement.LEFT
+			}];
+		});
+		const handleChange = async (event) => {
+			const control = event.target;
+			if (!(control instanceof HTMLInputElement)) return;
+			emit("change", control.checked);
+			await (0, vue.nextTick)();
+			if (control.checked !== modelValue.value) control.checked = modelValue.value;
+		};
+		return (_ctx, _cache) => {
+			return (0, vue.openBlock)(), (0, vue.createElementBlock)("label", (0, vue.mergeProps)({ class: "s-ui-toggle" }, (0, vue.unref)(getRootAttrs)(), { class: [rootClasses.value, { "s-ui-toggle--control-only": !(0, vue.unref)(slots).default && !(0, vue.unref)(slots).description }] }), [
+				(0, vue.withDirectives)((0, vue.createElementVNode)("input", (0, vue.mergeProps)({
+					"onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => modelValue.value = $event),
+					type: "checkbox",
+					role: "switch",
+					class: "s-ui-toggle__input"
+				}, (0, vue.unref)(getAriaAttrs)(), {
+					disabled: __props.disabled,
+					name: __props.name,
+					onChange: handleChange
+				}), null, 16, _hoisted_1), [[vue.vModelCheckbox, modelValue.value]]),
+				_cache[1] || (_cache[1] = (0, vue.createElementVNode)("span", { class: "s-ui-toggle__track" }, [(0, vue.createElementVNode)("span", { class: "s-ui-toggle__thumb-shell" }, [(0, vue.createElementVNode)("span", { class: "s-ui-toggle__thumb" })])], -1)),
+				(0, vue.unref)(slots).default || (0, vue.unref)(slots).description ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("span", _hoisted_2, [(0, vue.unref)(slots).default ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("span", _hoisted_3, [(0, vue.renderSlot)(_ctx.$slots, "default")])) : (0, vue.createCommentVNode)("", true), (0, vue.unref)(slots).description ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("span", _hoisted_4, [(0, vue.renderSlot)(_ctx.$slots, "description")])) : (0, vue.createCommentVNode)("", true)])) : (0, vue.createCommentVNode)("", true)
+			], 16);
+		};
+	}
+});
+//#endregion
+exports.default = SToggle_vue_vue_type_script_setup_true_lang_default;

package/dist/components/SToggle/SToggle.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,80 @@
+import { useAriaAttrs } from "../../composables/useAriaAttrs.js";
+import { ESToggleLabelPlacement, ESToggleSize } from "./SToggle.types.js";
+import { computed, createCommentVNode, createElementBlock, createElementVNode, defineComponent, mergeModels, mergeProps, nextTick, openBlock, renderSlot, unref, useModel, useSlots, vModelCheckbox, withDirectives } from "vue";
+//#region src/components/SToggle/SToggle.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1 = ["disabled", "name"];
+var _hoisted_2 = {
+	key: 0,
+	class: "s-ui-toggle__content"
+};
+var _hoisted_3 = {
+	key: 0,
+	class: "s-ui-toggle__label s-ui-typography-label-14-medium"
+};
+var _hoisted_4 = {
+	key: 1,
+	class: "s-ui-toggle__description s-ui-typography-body-12-regular"
+};
+var SToggle_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
+	inheritAttrs: false,
+	__name: "SToggle",
+	props: /*@__PURE__*/ mergeModels({
+		disabled: {
+			type: Boolean,
+			default: false
+		},
+		labelPlacement: { default: () => ESToggleLabelPlacement.RIGHT },
+		name: {},
+		size: { default: () => ESToggleSize.LARGE }
+	}, {
+		"modelValue": {
+			type: Boolean,
+			default: false
+		},
+		"modelModifiers": {}
+	}),
+	emits: /*@__PURE__*/ mergeModels(["change"], ["update:modelValue"]),
+	setup(__props, { emit: __emit }) {
+		/**
+		* Переключатель на нативном checkbox с `role="switch"`.
+		* @displayName SToggle
+		*/
+		const modelValue = useModel(__props, "modelValue");
+		/** Срабатывает при изменении нативного контрола; payload — состояние checked. */
+		const emit = __emit;
+		const { getRootAttrs, getAriaAttrs } = useAriaAttrs();
+		const slots = useSlots();
+		const rootClasses = computed(() => {
+			return [`s-ui-toggle--size-${__props.size}`, {
+				"s-ui-toggle--checked": modelValue.value,
+				"s-ui-toggle--disabled": __props.disabled,
+				"s-ui-toggle--label-left": __props.labelPlacement === ESToggleLabelPlacement.LEFT
+			}];
+		});
+		const handleChange = async (event) => {
+			const control = event.target;
+			if (!(control instanceof HTMLInputElement)) return;
+			emit("change", control.checked);
+			await nextTick();
+			if (control.checked !== modelValue.value) control.checked = modelValue.value;
+		};
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("label", mergeProps({ class: "s-ui-toggle" }, unref(getRootAttrs)(), { class: [rootClasses.value, { "s-ui-toggle--control-only": !unref(slots).default && !unref(slots).description }] }), [
+				withDirectives(createElementVNode("input", mergeProps({
+					"onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => modelValue.value = $event),
+					type: "checkbox",
+					role: "switch",
+					class: "s-ui-toggle__input"
+				}, unref(getAriaAttrs)(), {
+					disabled: __props.disabled,
+					name: __props.name,
+					onChange: handleChange
+				}), null, 16, _hoisted_1), [[vModelCheckbox, modelValue.value]]),
+				_cache[1] || (_cache[1] = createElementVNode("span", { class: "s-ui-toggle__track" }, [createElementVNode("span", { class: "s-ui-toggle__thumb-shell" }, [createElementVNode("span", { class: "s-ui-toggle__thumb" })])], -1)),
+				unref(slots).default || unref(slots).description ? (openBlock(), createElementBlock("span", _hoisted_2, [unref(slots).default ? (openBlock(), createElementBlock("span", _hoisted_3, [renderSlot(_ctx.$slots, "default")])) : createCommentVNode("", true), unref(slots).description ? (openBlock(), createElementBlock("span", _hoisted_4, [renderSlot(_ctx.$slots, "description")])) : createCommentVNode("", true)])) : createCommentVNode("", true)
+			], 16);
+		};
+	}
+});
+//#endregion
+export { SToggle_vue_vue_type_script_setup_true_lang_default as default };

package/dist/composables/connectedPosition/computeArrowPosition.cjs

@@ -0,0 +1,51 @@
+const require_types = require("./types.cjs");
+const require_parseAnchor = require("./parseAnchor.cjs");
+//#region src/composables/connectedPosition/computeArrowPosition.ts
+var clamp = (min, value, max) => Math.min(Math.max(value, min), max);
+var getStaticSide = (side) => {
+	if (side === require_types.EAnchorSide.TOP) return "bottom";
+	if (side === require_types.EAnchorSide.BOTTOM) return "top";
+	if (side === require_types.EAnchorSide.LEFT) return "right";
+	return "left";
+};
+var resolveCrossAxisArrowPosition = ({ referenceCenter, floatingStart, floatingLength, crossAxisProperty, staticSide, staticOffset, arrowSize, arrowPadding }) => {
+	const idealCenter = referenceCenter - floatingStart - arrowSize / 2;
+	const clampedCenter = clamp(arrowPadding, idealCenter, floatingLength - arrowSize - arrowPadding);
+	const centerOffset = idealCenter - clampedCenter;
+	return {
+		crossAxisPosition: clampedCenter,
+		crossAxisProperty,
+		staticSide,
+		staticOffset,
+		centerOffset,
+		isOverflow: Math.abs(centerOffset) > arrowSize / 2
+	};
+};
+var computeArrowPosition = (input) => {
+	const { referenceRect, floatingCoordinates, floatingSize, arrowSize, arrowPadding } = input;
+	const anchor = require_parseAnchor.parseAnchor(input.resolvedPlacement);
+	const staticSide = getStaticSide(anchor.side);
+	const staticOffset = -(arrowSize / 2);
+	if (anchor.side === require_types.EAnchorSide.TOP || anchor.side === require_types.EAnchorSide.BOTTOM) return resolveCrossAxisArrowPosition({
+		referenceCenter: referenceRect.left + referenceRect.width / 2,
+		floatingStart: floatingCoordinates.x,
+		floatingLength: floatingSize.width,
+		crossAxisProperty: "left",
+		staticSide,
+		staticOffset,
+		arrowSize,
+		arrowPadding
+	});
+	return resolveCrossAxisArrowPosition({
+		referenceCenter: referenceRect.top + referenceRect.height / 2,
+		floatingStart: floatingCoordinates.y,
+		floatingLength: floatingSize.height,
+		crossAxisProperty: "top",
+		staticSide,
+		staticOffset,
+		arrowSize,
+		arrowPadding
+	});
+};
+//#endregion
+exports.computeArrowPosition = computeArrowPosition;