@feugene/granularity 0.13.0 → 0.16.0

package/dist/components/GrStatistic/chunks/GrStatistic-CttyoYPT.js

@@ -0,0 +1,319 @@
+import { o as useGrComponentSize } from "../../../chunks/context-BSYR7RZs.js";
+import { n as useGranularityTranslations } from "../../../chunks/granularityI18n-BC5zsj_d.js";
+import { t as GrSkeleton_default } from "../../GrSkeleton/chunks/GrSkeleton-DEvNE3bC.js";
+import { a as statisticRootClass, c as statisticTrendClassByTrend, d as statisticValueClass, i as statisticPlaceholderHeightBySize, l as statisticTrendIconByTrend, o as statisticTitleClass, r as statisticAffixSizeBySize, s as statisticTitleSizeBySize, u as statisticTrendSizeBySize } from "../../../chunks/config-D8tSR2uS.js";
+import { computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, createVNode, defineComponent, markRaw, normalizeClass, onBeforeUnmount, onMounted, openBlock, ref, renderSlot, resolveDynamicComponent, toDisplayString, unref, useSlots, watch, withCtx } from "vue";
+//#region src/components/GrStatistic/countUp.ts
+/**
+* Перебор чисел для `GrStatistic`: чистая арифметика кадра без Vue и таймеров.
+*
+* Вынесено отдельным модулем по той же причине, что и `formatStatisticValue`:
+* кривая и округление проверяются напрямую, без монтирования и подмены `rAF`.
+*/
+/** Быстрый старт, мягкая остановка — та же форма, что у `--gr-ease-out`. */
+function easeOutCubic(t) {
+	return 1 - (1 - Math.min(Math.max(t, 0), 1)) ** 3;
+}
+/**
+* Значение кадра на `elapsed` миллисекунде перехода `from → to`.
+*
+* Округление до `precision` обязательно: без него кадры показывали бы
+* `1283.6666666666667` там, где показатель целый, и ширина строки прыгала бы
+* даже при `tabular-nums`. Последний кадр возвращает ровно `to` — приближение
+* не должно оставлять показатель в 1283.9999.
+*/
+function countUpFrame(from, to, elapsed, duration, precision) {
+	if (!(duration > 0) || elapsed >= duration) return to;
+	const digits = Math.min(Math.max(precision ?? 0, 0), 20);
+	const value = from + (to - from) * easeOutCubic(elapsed / duration);
+	return Number(value.toFixed(digits));
+}
+//#endregion
+//#region src/components/GrStatistic/formatStatisticValue.ts
+var DEFAULT_GROUP_SEPARATOR = " ";
+var DEFAULT_DECIMAL_SEPARATOR = ".";
+/**
+* Форматирует значение показателя: фиксирует точность и расставляет разделители.
+*
+* Нечисловые значения возвращаются без изменений — это позволяет показывать в
+* `GrStatistic` уже готовые строки («2 ч 15 мин», «—») без обходных пропов.
+* Вынесено из SFC отдельным модулем, чтобы тестировалось без монтирования.
+*
+* Порядок разрешения разделителей: явный проп → локаль → встроенный дефолт.
+*/
+function formatStatisticValue(value, options = {}) {
+	const { precision, groupSeparator, decimalSeparator, locale } = options;
+	const numeric = typeof value === "number" ? value : Number(value);
+	if (typeof value === "string" && (value.trim() === "" || !Number.isFinite(numeric))) return value;
+	if (!Number.isFinite(numeric)) return String(value);
+	if (locale) return formatByLocale(numeric, locale, {
+		precision,
+		groupSeparator,
+		decimalSeparator
+	});
+	const fixed = precision === void 0 ? String(numeric) : numeric.toFixed(precision);
+	if (fixed.includes("e") || fixed.includes("E")) return fixed;
+	const negative = fixed.startsWith("-");
+	const [intPart, fracPart] = (negative ? fixed.slice(1) : fixed).split(".");
+	const separator = groupSeparator ?? DEFAULT_GROUP_SEPARATOR;
+	const grouped = separator ? intPart.replace(/\B(?=(\d{3})+(?!\d))/g, separator) : intPart;
+	return [
+		negative ? "-" : "",
+		grouped,
+		fracPart ? `${decimalSeparator ?? DEFAULT_DECIMAL_SEPARATOR}${fracPart}` : ""
+	].join("");
+}
+/**
+* `formatToParts` вместо `format`: даёт заменить отдельные разделители, оставив
+* остальные правила локали (индийская группировка, знак минуса, порядок частей).
+*/
+function formatByLocale(value, locale, options) {
+	const { precision, groupSeparator, decimalSeparator } = options;
+	const digits = precision === void 0 ? void 0 : Math.min(Math.max(precision, 0), 20);
+	return new Intl.NumberFormat(locale, {
+		useGrouping: true,
+		minimumFractionDigits: digits,
+		maximumFractionDigits: digits ?? 20
+	}).formatToParts(value).map((part) => {
+		if (part.type === "group" && groupSeparator !== void 0) return groupSeparator;
+		if (part.type === "decimal" && decimalSeparator !== void 0) return decimalSeparator;
+		return part.value;
+	}).join("");
+}
+//#endregion
+//#region src/components/GrStatistic/GrStatistic.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1 = {
+	key: 0,
+	"data-gr-statistic-icon": "",
+	class: "mt-0.5 inline-flex h-9 w-9 shrink-0 items-center justify-center rounded-[var(--gr-radius-lg)] bg-[var(--gr-muted)] text-[var(--gr-muted-fg)]"
+};
+var _hoisted_2 = { class: "min-w-0" };
+var _hoisted_3 = { class: "sr-only" };
+var _hoisted_4 = ["aria-hidden"];
+var _hoisted_5 = {
+	key: 1,
+	"data-gr-statistic-final": "",
+	class: "sr-only"
+};
+var _hoisted_6 = {
+	key: 0,
+	"data-gr-statistic-trend-label": "",
+	class: "sr-only"
+};
+//#endregion
+//#region src/components/GrStatistic/GrStatistic.vue
+var GrStatistic_default = /* @__PURE__ */ defineComponent({
+	__name: "GrStatistic",
+	props: {
+		value: {},
+		title: { default: void 0 },
+		precision: { default: void 0 },
+		groupSeparator: { default: void 0 },
+		decimalSeparator: { default: void 0 },
+		locale: { default: void 0 },
+		prefix: { default: void 0 },
+		suffix: { default: void 0 },
+		icon: { default: void 0 },
+		size: { default: void 0 },
+		tone: { default: "neutral" },
+		trend: { default: void 0 },
+		trendText: { default: void 0 },
+		loading: {
+			type: Boolean,
+			default: false
+		},
+		animate: {
+			type: Boolean,
+			default: false
+		},
+		animateDuration: { default: 600 },
+		as: { default: void 0 },
+		href: { default: void 0 },
+		clickable: {
+			type: Boolean,
+			default: false
+		}
+	},
+	emits: ["click"],
+	setup(__props, { emit: __emit }) {
+		const props = __props;
+		const emit = __emit;
+		const slots = useSlots();
+		const { t, locale } = useGranularityTranslations();
+		const resolvedLocale = computed(() => props.locale ?? locale.value);
+		/**
+		* Число текущего кадра перебора. `null` — перебора нет, показываем сам проп:
+		* так значение остаётся конечным и на сервере, и до первого твина.
+		*/
+		const frameValue = ref(null);
+		const formatted = computed(() => formatStatisticValue(frameValue.value ?? props.value, {
+			precision: props.precision,
+			groupSeparator: props.groupSeparator,
+			decimalSeparator: props.decimalSeparator,
+			locale: resolvedLocale.value
+		}));
+		/** Конечное значение — то, что читает диктор, пока на экране идёт перебор. */
+		const finalFormatted = computed(() => formatStatisticValue(props.value, {
+			precision: props.precision,
+			groupSeparator: props.groupSeparator,
+			decimalSeparator: props.decimalSeparator,
+			locale: resolvedLocale.value
+		}));
+		const isCounting = computed(() => frameValue.value !== null);
+		const hasTitle = computed(() => Boolean(props.title || slots.title));
+		const isInteractive = computed(() => Boolean(props.as || props.href || props.clickable));
+		const rootTag = computed(() => {
+			if (props.as) return typeof props.as === "string" ? props.as : markRaw(props.as);
+			if (props.href) return "a";
+			return props.clickable ? "button" : "div";
+		});
+		const rootClass = computed(() => statisticRootClass({ interactive: isInteractive.value }));
+		function toNumber(value) {
+			const numeric = typeof value === "number" ? value : Number(value);
+			return Number.isFinite(numeric) ? numeric : null;
+		}
+		let frameHandle = null;
+		function stopCounting() {
+			if (frameHandle !== null) cancelAnimationFrame(frameHandle);
+			frameHandle = null;
+		}
+		/**
+		* Перебор чисел ведёт JS, а глобальный кламп в `base.css` гасит только CSS —
+		* значит уважать «уменьшить движение» обязан сам компонент (`docs/motion.md`).
+		* Читается в момент старта, а не в теле `setup`: `matchMedia` на сервере нет, и
+		* первый клиентский рендер разошёлся бы с серверным.
+		*/
+		function prefersReducedMotion() {
+			return typeof window !== "undefined" && window.matchMedia?.("(prefers-reduced-motion: reduce)")?.matches === true;
+		}
+		function runCountUp(from, to) {
+			stopCounting();
+			const duration = props.animateDuration;
+			if (!(duration > 0) || from === to || prefersReducedMotion()) {
+				frameValue.value = null;
+				return;
+			}
+			const started = performance.now();
+			frameValue.value = from;
+			const step = (now) => {
+				const elapsed = now - started;
+				const value = countUpFrame(from, to, elapsed, duration, props.precision);
+				if (elapsed >= duration) {
+					frameValue.value = null;
+					frameHandle = null;
+					return;
+				}
+				frameValue.value = value;
+				frameHandle = requestAnimationFrame(step);
+			};
+			frameHandle = requestAnimationFrame(step);
+		}
+		/** Перебирать можно только числа: «2 ч 15 мин» и «—» ставятся сразу. */
+		function startIfNumeric(from, to) {
+			if (!props.animate || props.loading) {
+				stopCounting();
+				frameValue.value = null;
+				return;
+			}
+			const target = toNumber(to);
+			const source = toNumber(from);
+			if (target === null || source === null) {
+				stopCounting();
+				frameValue.value = null;
+				return;
+			}
+			runCountUp(source, target);
+		}
+		onMounted(() => startIfNumeric(0, props.value));
+		watch(() => props.value, (next, prev) => startIfNumeric(prev, next));
+		onBeforeUnmount(stopCounting);
+		const resolvedSize = useGrComponentSize(() => props.size, { component: "GrStatistic" });
+		const trendLabel = computed(() => {
+			if (!props.trend) return void 0;
+			return {
+				up: () => t("gr.statistic.trendUp", "Increase"),
+				down: () => t("gr.statistic.trendDown", "Decrease"),
+				flat: () => t("gr.statistic.trendFlat", "No change")
+			}[props.trend]();
+		});
+		return (_ctx, _cache) => {
+			return openBlock(), createBlock(resolveDynamicComponent(rootTag.value), {
+				"data-gr-statistic": "",
+				type: rootTag.value === "button" ? "button" : void 0,
+				href: rootTag.value === "a" ? __props.href : void 0,
+				class: normalizeClass(rootClass.value),
+				onClick: _cache[0] || (_cache[0] = ($event) => emit("click", $event))
+			}, {
+				default: withCtx(() => [__props.icon || _ctx.$slots.icon ? (openBlock(), createElementBlock("span", _hoisted_1, [renderSlot(_ctx.$slots, "icon", {}, () => [createElementVNode("span", {
+					class: normalizeClass(["block h-4 w-4", __props.icon]),
+					"aria-hidden": "true"
+				}, null, 2)])])) : createCommentVNode("", true), createElementVNode("div", _hoisted_2, [(openBlock(), createBlock(resolveDynamicComponent(hasTitle.value ? "dl" : "div"), { class: "m-0" }, {
+					default: withCtx(() => [hasTitle.value ? (openBlock(), createElementBlock("dt", {
+						key: 0,
+						"data-gr-statistic-title": "",
+						class: normalizeClass([unref(statisticTitleClass), unref(statisticTitleSizeBySize)[unref(resolvedSize)]])
+					}, [renderSlot(_ctx.$slots, "title", {}, () => [createTextVNode(toDisplayString(__props.title), 1)])], 2)) : createCommentVNode("", true), __props.loading ? (openBlock(), createBlock(resolveDynamicComponent(hasTitle.value ? "dd" : "div"), {
+						key: 1,
+						"data-gr-statistic-placeholder": "",
+						"data-testid": "gr-statistic-placeholder",
+						class: "m-0 mt-1",
+						role: "status",
+						"aria-busy": "true"
+					}, {
+						default: withCtx(() => [createVNode(GrSkeleton_default, {
+							width: "6rem",
+							height: unref(statisticPlaceholderHeightBySize)[unref(resolvedSize)],
+							rounded: "var(--gr-radius-md)"
+						}, null, 8, ["height"]), createElementVNode("span", _hoisted_3, toDisplayString(unref(t)("gr.loading.defaultText", "Loading...")), 1)]),
+						_: 1
+					})) : (openBlock(), createBlock(resolveDynamicComponent(hasTitle.value ? "dd" : "div"), {
+						key: 2,
+						"data-gr-statistic-value": "",
+						"data-testid": "gr-statistic-value",
+						class: "m-0 mt-0.5 flex items-baseline gap-1"
+					}, {
+						default: withCtx(() => [
+							__props.prefix || _ctx.$slots.prefix ? (openBlock(), createElementBlock("span", {
+								key: 0,
+								"data-gr-statistic-prefix": "",
+								class: normalizeClass(["text-[var(--gr-muted-fg)]", unref(statisticAffixSizeBySize)[unref(resolvedSize)]])
+							}, [renderSlot(_ctx.$slots, "prefix", {}, () => [createTextVNode(toDisplayString(__props.prefix), 1)])], 2)) : createCommentVNode("", true),
+							createElementVNode("span", {
+								"data-gr-statistic-number": "",
+								class: normalizeClass(unref(statisticValueClass)({
+									size: unref(resolvedSize),
+									tone: __props.tone
+								})),
+								"aria-hidden": isCounting.value ? "true" : void 0
+							}, [renderSlot(_ctx.$slots, "default", {}, () => [createTextVNode(toDisplayString(formatted.value), 1)])], 10, _hoisted_4),
+							isCounting.value ? (openBlock(), createElementBlock("span", _hoisted_5, toDisplayString(finalFormatted.value), 1)) : createCommentVNode("", true),
+							__props.suffix || _ctx.$slots.suffix ? (openBlock(), createElementBlock("span", {
+								key: 2,
+								"data-gr-statistic-suffix": "",
+								class: normalizeClass(["text-[var(--gr-muted-fg)]", unref(statisticAffixSizeBySize)[unref(resolvedSize)]])
+							}, [renderSlot(_ctx.$slots, "suffix", {}, () => [createTextVNode(toDisplayString(__props.suffix), 1)])], 2)) : createCommentVNode("", true)
+						]),
+						_: 3
+					}))]),
+					_: 3
+				})), __props.trend || __props.trendText || _ctx.$slots.trend ? (openBlock(), createElementBlock("div", {
+					key: 0,
+					"data-gr-statistic-trend": "",
+					"data-testid": "gr-statistic-trend",
+					class: normalizeClass(["mt-1 inline-flex items-center gap-1", [unref(statisticTrendSizeBySize)[unref(resolvedSize)], unref(statisticTrendClassByTrend)[__props.trend ?? "flat"]]])
+				}, [trendLabel.value ? (openBlock(), createElementBlock("span", _hoisted_6, toDisplayString(trendLabel.value), 1)) : createCommentVNode("", true), renderSlot(_ctx.$slots, "trend", {}, () => [__props.trend ? (openBlock(), createElementBlock("span", {
+					key: 0,
+					class: normalizeClass(["block h-3.5 w-3.5", unref(statisticTrendIconByTrend)[__props.trend]]),
+					"aria-hidden": "true"
+				}, null, 2)) : createCommentVNode("", true), createElementVNode("span", null, toDisplayString(__props.trendText), 1)])], 2)) : createCommentVNode("", true)])]),
+				_: 3
+			}, 8, [
+				"type",
+				"href",
+				"class"
+			]);
+		};
+	}
+});
+//#endregion
+export { formatStatisticValue as n, GrStatistic_default as t };

package/dist/components/GrStatistic/chunks/GrStatistic-CttyoYPT.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"GrStatistic-CttyoYPT.js","names":["$slots"],"sources":["../../../../src/components/GrStatistic/countUp.ts","../../../../src/components/GrStatistic/formatStatisticValue.ts","../../../../src/components/GrStatistic/GrStatistic.vue","../../../../src/components/GrStatistic/GrStatistic.vue"],"sourcesContent":["/**\n * Перебор чисел для `GrStatistic`: чистая арифметика кадра без Vue и таймеров.\n *\n * Вынесено отдельным модулем по той же причине, что и `formatStatisticValue`:\n * кривая и округление проверяются напрямую, без монтирования и подмены `rAF`.\n */\n\n/** Быстрый старт, мягкая остановка — та же форма, что у `--gr-ease-out`. */\nexport function easeOutCubic(t: number): number {\n  const clamped = Math.min(Math.max(t, 0), 1)\n  return 1 - (1 - clamped) ** 3\n}\n\n/**\n * Значение кадра на `elapsed` миллисекунде перехода `from → to`.\n *\n * Округление до `precision` обязательно: без него кадры показывали бы\n * `1283.6666666666667` там, где показатель целый, и ширина строки прыгала бы\n * даже при `tabular-nums`. Последний кадр возвращает ровно `to` — приближение\n * не должно оставлять показатель в 1283.9999.\n */\nexport function countUpFrame(\n  from: number,\n  to: number,\n  elapsed: number,\n  duration: number,\n  precision?: number,\n): number {\n  if (!(duration > 0) || elapsed >= duration) return to\n\n  const digits = Math.min(Math.max(precision ?? 0, 0), 20)\n  const value = from + (to - from) * easeOutCubic(elapsed / duration)\n\n  return Number(value.toFixed(digits))\n}\n","export type GrStatisticFormatOptions = {\n  /** Число знаков после запятой. `undefined` — оставить как есть. */\n  precision?: number\n  /** Разделитель групп разрядов. Сильнее локали. */\n  groupSeparator?: string\n  /** Десятичный разделитель. Сильнее локали. */\n  decimalSeparator?: string\n  /** BCP-47 локаль: разделители берутся из `Intl.NumberFormat`. */\n  locale?: string\n}\n\nconst DEFAULT_GROUP_SEPARATOR = ' '\nconst DEFAULT_DECIMAL_SEPARATOR = '.'\n\n/**\n * Форматирует значение показателя: фиксирует точность и расставляет разделители.\n *\n * Нечисловые значения возвращаются без изменений — это позволяет показывать в\n * `GrStatistic` уже готовые строки («2 ч 15 мин», «—») без обходных пропов.\n * Вынесено из SFC отдельным модулем, чтобы тестировалось без монтирования.\n *\n * Порядок разрешения разделителей: явный проп → локаль → встроенный дефолт.\n */\nexport function formatStatisticValue(\n  value: number | string,\n  options: GrStatisticFormatOptions = {},\n): string {\n  const { precision, groupSeparator, decimalSeparator, locale } = options\n\n  const numeric = typeof value === 'number' ? value : Number(value)\n  if (typeof value === 'string' && (value.trim() === '' || !Number.isFinite(numeric))) {\n    return value\n  }\n  if (!Number.isFinite(numeric)) return String(value)\n\n  if (locale) {\n    return formatByLocale(numeric, locale, { precision, groupSeparator, decimalSeparator })\n  }\n\n  const fixed = precision === undefined ? String(numeric) : numeric.toFixed(precision)\n  // `toFixed` не даёт экспоненциальной записи, а `String(число)` — может (1e21+).\n  // В таком случае группировать нечего: возвращаем как есть.\n  if (fixed.includes('e') || fixed.includes('E')) return fixed\n\n  const negative = fixed.startsWith('-')\n  const [intPart, fracPart] = (negative ? fixed.slice(1) : fixed).split('.')\n\n  const separator = groupSeparator ?? DEFAULT_GROUP_SEPARATOR\n  const grouped = separator\n    ? intPart.replace(/\\B(?=(\\d{3})+(?!\\d))/g, separator)\n    : intPart\n\n  return [\n    negative ? '-' : '',\n    grouped,\n    fracPart ? `${decimalSeparator ?? DEFAULT_DECIMAL_SEPARATOR}${fracPart}` : '',\n  ].join('')\n}\n\n/**\n * `formatToParts` вместо `format`: даёт заменить отдельные разделители, оставив\n * остальные правила локали (индийская группировка, знак минуса, порядок частей).\n */\nfunction formatByLocale(\n  value: number,\n  locale: string,\n  options: Pick<GrStatisticFormatOptions, 'precision' | 'groupSeparator' | 'decimalSeparator'>,\n): string {\n  const { precision, groupSeparator, decimalSeparator } = options\n  // `Intl` принимает не больше 20 знаков и падает `RangeError` на большем,\n  // тогда как ручная ветка через `toFixed` пережила бы до 100.\n  const digits = precision === undefined ? undefined : Math.min(Math.max(precision, 0), 20)\n\n  return new Intl.NumberFormat(locale, {\n    useGrouping: true,\n    minimumFractionDigits: digits,\n    maximumFractionDigits: digits ?? 20,\n  })\n    .formatToParts(value)\n    .map((part) => {\n      if (part.type === 'group' && groupSeparator !== undefined) return groupSeparator\n      if (part.type === 'decimal' && decimalSeparator !== undefined) return decimalSeparator\n      return part.value\n    })\n    .join('')\n}\n","<script setup lang=\"ts\">\nimport { useGrComponentSize } from '../GrConfigProvider/context'\nimport { computed, markRaw, onBeforeUnmount, onMounted, ref, useSlots, watch, type Component } from 'vue'\n\nimport { useGranularityTranslations } from '../../internal/granularityI18n'\nimport GrSkeleton from '../GrSkeleton/GrSkeleton.vue'\n\nimport { countUpFrame } from './countUp'\nimport { formatStatisticValue } from './formatStatisticValue'\n\nimport {\n  statisticAffixSizeBySize,\n  statisticPlaceholderHeightBySize,\n  statisticRootClass,\n  statisticTitleClass,\n  statisticTitleSizeBySize,\n  statisticTrendClassByTrend,\n  statisticTrendIconByTrend,\n  statisticTrendSizeBySize,\n  statisticValueClass,\n  type GrStatisticSize,\n  type GrStatisticTone,\n  type GrStatisticTrend,\n} from './grStatisticStyles'\n\nexport type {\n  GrStatisticSize,\n  GrStatisticTone,\n  GrStatisticTrend,\n} from './grStatisticStyles'\nexport type { GrStatisticFormatOptions } from './formatStatisticValue'\n\n/**\n * Публичный GR-примитив «Statistic» — крупный числовой показатель с подписью,\n * префиксом/суффиксом и строкой динамики.\n *\n * Компонент презентационный: не грузит данные и не считает дельту, только\n * форматирует и подаёт. Форматирование — чистая функция `formatStatisticValue`.\n */\nexport interface GrStatisticProps {\n  /** Значение показателя. Нечисловая строка выводится как есть. */\n  value: number | string\n  /** Подпись над значением. */\n  title?: string\n  /** Число знаков после запятой. */\n  precision?: number\n  /** Разделитель разрядов. Сильнее локали; без него и без локали — узкий пробел. */\n  groupSeparator?: string\n  /** Десятичный разделитель. Сильнее локали; без него и без локали — точка. */\n  decimalSeparator?: string\n  /**\n   * BCP-47 локаль форматирования. Не задана — берётся из i18n-адаптера; нет и\n   * адаптера — работают ручные разделители.\n   */\n  locale?: string\n  /** Приписка перед значением (валюта, знак). */\n  prefix?: string\n  /** Приписка после значения (единица измерения, `%`). */\n  suffix?: string\n  /** UnoCSS-класс иконки слева от блока (например `i-lucide-users`). */\n  icon?: string\n  size?: GrStatisticSize\n  /** Тон значения; точечно перекрывается `--gr-statistic-value-color`. */\n  tone?: GrStatisticTone\n  /** Направление динамики — задаёт цвет и иконку строки под значением. */\n  trend?: GrStatisticTrend\n  /** Текст динамики (например `+12,5% к прошлой неделе`). */\n  trendText?: string\n  /** Состояние загрузки: вместо значения — плейсхолдер. */\n  loading?: boolean\n  /**\n   * Перебирать числа при появлении и при смене значения. Нечисловое значение\n   * ставится сразу, под `prefers-reduced-motion: reduce` — тоже.\n   */\n  animate?: boolean\n  /**\n   * Длительность перебора в миллисекундах. Не токеном: шкала `--gr-duration-*`\n   * заканчивается на 300 мс и описывает смену состояния, а перебор чисел —\n   * другой жанр, и его число живёт там же, где твин.\n   */\n  animateDuration?: number\n  /** Свой корневой тег (`RouterLink`, `Link` от Inertia). Сильнее `href`. */\n  as?: string | Component\n  /** Показатель-ссылка: переход к деталям. */\n  href?: string\n  /** Показатель-кнопка: интерактивна вся плитка. */\n  clickable?: boolean\n}\n\nexport interface GrStatisticEmits {\n  (e: 'click', event: MouseEvent): void\n}\n\nconst props = withDefaults(\n  defineProps<GrStatisticProps>(),\n  {\n    title: undefined,\n    precision: undefined,\n    // Дефолты живут в `formatStatisticValue`: иначе «пользователь задал пробел»\n    // было бы неотличимо от «сработал дефолт», и локаль не смогла бы победить.\n    groupSeparator: undefined,\n    decimalSeparator: undefined,\n    locale: undefined,\n    prefix: undefined,\n    suffix: undefined,\n    icon: undefined,\n    size: undefined,\n    tone: 'neutral',\n    trend: undefined,\n    trendText: undefined,\n    loading: false,\n    animate: false,\n    animateDuration: 600,\n    as: undefined,\n    href: undefined,\n    clickable: false,\n  },\n)\n\nconst emit = defineEmits<GrStatisticEmits>()\n\nconst slots = useSlots()\n\nconst { t, locale } = useGranularityTranslations()\n\nconst resolvedLocale = computed(() => props.locale ?? locale.value)\n\n/**\n * Число текущего кадра перебора. `null` — перебора нет, показываем сам проп:\n * так значение остаётся конечным и на сервере, и до первого твина.\n */\nconst frameValue = ref<number | null>(null)\n\nconst formatted = computed(() => formatStatisticValue(frameValue.value ?? props.value, {\n  precision: props.precision,\n  groupSeparator: props.groupSeparator,\n  decimalSeparator: props.decimalSeparator,\n  locale: resolvedLocale.value,\n}))\n\n/** Конечное значение — то, что читает диктор, пока на экране идёт перебор. */\nconst finalFormatted = computed(() => formatStatisticValue(props.value, {\n  precision: props.precision,\n  groupSeparator: props.groupSeparator,\n  decimalSeparator: props.decimalSeparator,\n  locale: resolvedLocale.value,\n}))\n\nconst isCounting = computed(() => frameValue.value !== null)\n\nconst hasTitle = computed(() => Boolean(props.title || slots.title))\n\nconst isInteractive = computed(() => Boolean(props.as || props.href || props.clickable))\n\nconst rootTag = computed<string | Component>(() => {\n  if (props.as)\n    return typeof props.as === 'string' ? props.as : markRaw(props.as)\n\n  if (props.href)\n    return 'a'\n\n  return props.clickable ? 'button' : 'div'\n})\n\nconst rootClass = computed(() => statisticRootClass({ interactive: isInteractive.value }))\n\nfunction toNumber(value: number | string): number | null {\n  const numeric = typeof value === 'number' ? value : Number(value)\n  return Number.isFinite(numeric) ? numeric : null\n}\n\nlet frameHandle: number | null = null\n\nfunction stopCounting(): void {\n  if (frameHandle !== null) cancelAnimationFrame(frameHandle)\n  frameHandle = null\n}\n\n/**\n * Перебор чисел ведёт JS, а глобальный кламп в `base.css` гасит только CSS —\n * значит уважать «уменьшить движение» обязан сам компонент (`docs/motion.md`).\n * Читается в момент старта, а не в теле `setup`: `matchMedia` на сервере нет, и\n * первый клиентский рендер разошёлся бы с серверным.\n */\nfunction prefersReducedMotion(): boolean {\n  return typeof window !== 'undefined'\n    && window.matchMedia?.('(prefers-reduced-motion: reduce)')?.matches === true\n}\n\nfunction runCountUp(from: number, to: number): void {\n  stopCounting()\n\n  const duration = props.animateDuration\n  if (!(duration > 0) || from === to || prefersReducedMotion()) {\n    frameValue.value = null\n    return\n  }\n\n  const started = performance.now()\n  frameValue.value = from\n\n  const step = (now: number): void => {\n    const elapsed = now - started\n    const value = countUpFrame(from, to, elapsed, duration, props.precision)\n\n    if (elapsed >= duration) {\n      // Конец перебора снимает и подмену значения, и подмену для диктора.\n      frameValue.value = null\n      frameHandle = null\n      return\n    }\n\n    frameValue.value = value\n    frameHandle = requestAnimationFrame(step)\n  }\n\n  frameHandle = requestAnimationFrame(step)\n}\n\n/** Перебирать можно только числа: «2 ч 15 мин» и «—» ставятся сразу. */\nfunction startIfNumeric(from: number | string, to: number | string): void {\n  if (!props.animate || props.loading) {\n    stopCounting()\n    frameValue.value = null\n    return\n  }\n\n  const target = toNumber(to)\n  const source = toNumber(from)\n\n  if (target === null || source === null) {\n    stopCounting()\n    frameValue.value = null\n    return\n  }\n\n  runCountUp(source, target)\n}\n\n// Появление плитки считается переходом от нуля: ради этого эффекта проп и нужен.\nonMounted(() => startIfNumeric(0, props.value))\n\nwatch(() => props.value, (next, prev) => startIfNumeric(prev, next))\n\nonBeforeUnmount(stopCounting)\n\nconst resolvedSize = useGrComponentSize(() => props.size, { component: 'GrStatistic' })\n\n// Иконка направления `aria-hidden`, а «+12,5 %» само по себе рост от падения не\n// отличает: направление доносит скрытая подпись.\nconst trendLabel = computed(() => {\n  if (!props.trend) return undefined\n\n  const labels = {\n    up: () => t('gr.statistic.trendUp', 'Increase'),\n    down: () => t('gr.statistic.trendDown', 'Decrease'),\n    flat: () => t('gr.statistic.trendFlat', 'No change'),\n  }\n\n  return labels[props.trend]()\n})\n</script>\n\n<template>\n  <component\n    :is=\"rootTag\"\n    data-gr-statistic\n    :type=\"rootTag === 'button' ? 'button' : undefined\"\n    :href=\"rootTag === 'a' ? href : undefined\"\n    :class=\"rootClass\"\n    @click=\"emit('click', $event)\"\n  >\n    <span\n      v-if=\"icon || $slots.icon\"\n      data-gr-statistic-icon\n      class=\"mt-0.5 inline-flex h-9 w-9 shrink-0 items-center justify-center rounded-[var(--gr-radius-lg)] bg-[var(--gr-muted)] text-[var(--gr-muted-fg)]\"\n    >\n      <slot name=\"icon\">\n        <span class=\"block h-4 w-4\" :class=\"icon\" aria-hidden=\"true\" />\n      </slot>\n    </span>\n\n    <div class=\"min-w-0\">\n      <!--\n        Подпись и значение — пара «термин — значение», а не два соседних блока.\n        `<dl>` появляется только вместе с подписью: список определений без `<dt>`\n        — та же бессвязность, только с претензией на семантику. Поля обнуляются\n        руками: preflight пакета сбрасывает их лишь у `body`.\n      -->\n      <component :is=\"hasTitle ? 'dl' : 'div'\" class=\"m-0\">\n        <dt\n          v-if=\"hasTitle\"\n          data-gr-statistic-title\n          :class=\"[statisticTitleClass, statisticTitleSizeBySize[resolvedSize]]\"\n        >\n          <slot name=\"title\">\n            {{ title }}\n          </slot>\n        </dt>\n\n        <!-- Плейсхолдер загрузки повторяет высоту строки значения, чтобы блок не прыгал. -->\n        <component\n          :is=\"hasTitle ? 'dd' : 'div'\"\n          v-if=\"loading\"\n          data-gr-statistic-placeholder\n          data-testid=\"gr-statistic-placeholder\"\n          class=\"m-0 mt-1\"\n          role=\"status\"\n          aria-busy=\"true\"\n        >\n          <GrSkeleton\n            width=\"6rem\"\n            :height=\"statisticPlaceholderHeightBySize[resolvedSize]\"\n            rounded=\"var(--gr-radius-md)\"\n          />\n          <span class=\"sr-only\">{{ t('gr.loading.defaultText', 'Loading...') }}</span>\n        </component>\n\n        <component\n          :is=\"hasTitle ? 'dd' : 'div'\"\n          v-else\n          data-gr-statistic-value\n          data-testid=\"gr-statistic-value\"\n          class=\"m-0 mt-0.5 flex items-baseline gap-1\"\n        >\n          <span\n            v-if=\"prefix || $slots.prefix\"\n            data-gr-statistic-prefix\n            class=\"text-[var(--gr-muted-fg)]\"\n            :class=\"statisticAffixSizeBySize[resolvedSize]\"\n          >\n            <slot name=\"prefix\">{{ prefix }}</slot>\n          </span>\n\n          <span\n            data-gr-statistic-number\n            :class=\"statisticValueClass({ size: resolvedSize, tone })\"\n            :aria-hidden=\"isCounting ? 'true' : undefined\"\n          >\n            <slot>{{ formatted }}</slot>\n          </span>\n\n          <!--\n            Пока идёт перебор, на экране промежуточное число. Диктору отдаётся\n            конечное: «1 284» глазами и «743» в ушах — не шум, а неверные данные.\n          -->\n          <span v-if=\"isCounting\" data-gr-statistic-final class=\"sr-only\">{{ finalFormatted }}</span>\n\n          <span\n            v-if=\"suffix || $slots.suffix\"\n            data-gr-statistic-suffix\n            class=\"text-[var(--gr-muted-fg)]\"\n            :class=\"statisticAffixSizeBySize[resolvedSize]\"\n          >\n            <slot name=\"suffix\">{{ suffix }}</slot>\n          </span>\n        </component>\n      </component>\n\n      <div\n        v-if=\"trend || trendText || $slots.trend\"\n        data-gr-statistic-trend\n        data-testid=\"gr-statistic-trend\"\n        class=\"mt-1 inline-flex items-center gap-1\"\n        :class=\"[statisticTrendSizeBySize[resolvedSize], statisticTrendClassByTrend[trend ?? 'flat']]\"\n      >\n        <span v-if=\"trendLabel\" data-gr-statistic-trend-label class=\"sr-only\">{{ trendLabel }}</span>\n\n        <slot name=\"trend\">\n          <span\n            v-if=\"trend\"\n            class=\"block h-3.5 w-3.5\"\n            :class=\"statisticTrendIconByTrend[trend]\"\n            aria-hidden=\"true\"\n          />\n          <span>{{ trendText }}</span>\n        </slot>\n      </div>\n    </div>\n  </component>\n</template>\n","<script setup lang=\"ts\">\nimport { useGrComponentSize } from '../GrConfigProvider/context'\nimport { computed, markRaw, onBeforeUnmount, onMounted, ref, useSlots, watch, type Component } from 'vue'\n\nimport { useGranularityTranslations } from '../../internal/granularityI18n'\nimport GrSkeleton from '../GrSkeleton/GrSkeleton.vue'\n\nimport { countUpFrame } from './countUp'\nimport { formatStatisticValue } from './formatStatisticValue'\n\nimport {\n  statisticAffixSizeBySize,\n  statisticPlaceholderHeightBySize,\n  statisticRootClass,\n  statisticTitleClass,\n  statisticTitleSizeBySize,\n  statisticTrendClassByTrend,\n  statisticTrendIconByTrend,\n  statisticTrendSizeBySize,\n  statisticValueClass,\n  type GrStatisticSize,\n  type GrStatisticTone,\n  type GrStatisticTrend,\n} from './grStatisticStyles'\n\nexport type {\n  GrStatisticSize,\n  GrStatisticTone,\n  GrStatisticTrend,\n} from './grStatisticStyles'\nexport type { GrStatisticFormatOptions } from './formatStatisticValue'\n\n/**\n * Публичный GR-примитив «Statistic» — крупный числовой показатель с подписью,\n * префиксом/суффиксом и строкой динамики.\n *\n * Компонент презентационный: не грузит данные и не считает дельту, только\n * форматирует и подаёт. Форматирование — чистая функция `formatStatisticValue`.\n */\nexport interface GrStatisticProps {\n  /** Значение показателя. Нечисловая строка выводится как есть. */\n  value: number | string\n  /** Подпись над значением. */\n  title?: string\n  /** Число знаков после запятой. */\n  precision?: number\n  /** Разделитель разрядов. Сильнее локали; без него и без локали — узкий пробел. */\n  groupSeparator?: string\n  /** Десятичный разделитель. Сильнее локали; без него и без локали — точка. */\n  decimalSeparator?: string\n  /**\n   * BCP-47 локаль форматирования. Не задана — берётся из i18n-адаптера; нет и\n   * адаптера — работают ручные разделители.\n   */\n  locale?: string\n  /** Приписка перед значением (валюта, знак). */\n  prefix?: string\n  /** Приписка после значения (единица измерения, `%`). */\n  suffix?: string\n  /** UnoCSS-класс иконки слева от блока (например `i-lucide-users`). */\n  icon?: string\n  size?: GrStatisticSize\n  /** Тон значения; точечно перекрывается `--gr-statistic-value-color`. */\n  tone?: GrStatisticTone\n  /** Направление динамики — задаёт цвет и иконку строки под значением. */\n  trend?: GrStatisticTrend\n  /** Текст динамики (например `+12,5% к прошлой неделе`). */\n  trendText?: string\n  /** Состояние загрузки: вместо значения — плейсхолдер. */\n  loading?: boolean\n  /**\n   * Перебирать числа при появлении и при смене значения. Нечисловое значение\n   * ставится сразу, под `prefers-reduced-motion: reduce` — тоже.\n   */\n  animate?: boolean\n  /**\n   * Длительность перебора в миллисекундах. Не токеном: шкала `--gr-duration-*`\n   * заканчивается на 300 мс и описывает смену состояния, а перебор чисел —\n   * другой жанр, и его число живёт там же, где твин.\n   */\n  animateDuration?: number\n  /** Свой корневой тег (`RouterLink`, `Link` от Inertia). Сильнее `href`. */\n  as?: string | Component\n  /** Показатель-ссылка: переход к деталям. */\n  href?: string\n  /** Показатель-кнопка: интерактивна вся плитка. */\n  clickable?: boolean\n}\n\nexport interface GrStatisticEmits {\n  (e: 'click', event: MouseEvent): void\n}\n\nconst props = withDefaults(\n  defineProps<GrStatisticProps>(),\n  {\n    title: undefined,\n    precision: undefined,\n    // Дефолты живут в `formatStatisticValue`: иначе «пользователь задал пробел»\n    // было бы неотличимо от «сработал дефолт», и локаль не смогла бы победить.\n    groupSeparator: undefined,\n    decimalSeparator: undefined,\n    locale: undefined,\n    prefix: undefined,\n    suffix: undefined,\n    icon: undefined,\n    size: undefined,\n    tone: 'neutral',\n    trend: undefined,\n    trendText: undefined,\n    loading: false,\n    animate: false,\n    animateDuration: 600,\n    as: undefined,\n    href: undefined,\n    clickable: false,\n  },\n)\n\nconst emit = defineEmits<GrStatisticEmits>()\n\nconst slots = useSlots()\n\nconst { t, locale } = useGranularityTranslations()\n\nconst resolvedLocale = computed(() => props.locale ?? locale.value)\n\n/**\n * Число текущего кадра перебора. `null` — перебора нет, показываем сам проп:\n * так значение остаётся конечным и на сервере, и до первого твина.\n */\nconst frameValue = ref<number | null>(null)\n\nconst formatted = computed(() => formatStatisticValue(frameValue.value ?? props.value, {\n  precision: props.precision,\n  groupSeparator: props.groupSeparator,\n  decimalSeparator: props.decimalSeparator,\n  locale: resolvedLocale.value,\n}))\n\n/** Конечное значение — то, что читает диктор, пока на экране идёт перебор. */\nconst finalFormatted = computed(() => formatStatisticValue(props.value, {\n  precision: props.precision,\n  groupSeparator: props.groupSeparator,\n  decimalSeparator: props.decimalSeparator,\n  locale: resolvedLocale.value,\n}))\n\nconst isCounting = computed(() => frameValue.value !== null)\n\nconst hasTitle = computed(() => Boolean(props.title || slots.title))\n\nconst isInteractive = computed(() => Boolean(props.as || props.href || props.clickable))\n\nconst rootTag = computed<string | Component>(() => {\n  if (props.as)\n    return typeof props.as === 'string' ? props.as : markRaw(props.as)\n\n  if (props.href)\n    return 'a'\n\n  return props.clickable ? 'button' : 'div'\n})\n\nconst rootClass = computed(() => statisticRootClass({ interactive: isInteractive.value }))\n\nfunction toNumber(value: number | string): number | null {\n  const numeric = typeof value === 'number' ? value : Number(value)\n  return Number.isFinite(numeric) ? numeric : null\n}\n\nlet frameHandle: number | null = null\n\nfunction stopCounting(): void {\n  if (frameHandle !== null) cancelAnimationFrame(frameHandle)\n  frameHandle = null\n}\n\n/**\n * Перебор чисел ведёт JS, а глобальный кламп в `base.css` гасит только CSS —\n * значит уважать «уменьшить движение» обязан сам компонент (`docs/motion.md`).\n * Читается в момент старта, а не в теле `setup`: `matchMedia` на сервере нет, и\n * первый клиентский рендер разошёлся бы с серверным.\n */\nfunction prefersReducedMotion(): boolean {\n  return typeof window !== 'undefined'\n    && window.matchMedia?.('(prefers-reduced-motion: reduce)')?.matches === true\n}\n\nfunction runCountUp(from: number, to: number): void {\n  stopCounting()\n\n  const duration = props.animateDuration\n  if (!(duration > 0) || from === to || prefersReducedMotion()) {\n    frameValue.value = null\n    return\n  }\n\n  const started = performance.now()\n  frameValue.value = from\n\n  const step = (now: number): void => {\n    const elapsed = now - started\n    const value = countUpFrame(from, to, elapsed, duration, props.precision)\n\n    if (elapsed >= duration) {\n      // Конец перебора снимает и подмену значения, и подмену для диктора.\n      frameValue.value = null\n      frameHandle = null\n      return\n    }\n\n    frameValue.value = value\n    frameHandle = requestAnimationFrame(step)\n  }\n\n  frameHandle = requestAnimationFrame(step)\n}\n\n/** Перебирать можно только числа: «2 ч 15 мин» и «—» ставятся сразу. */\nfunction startIfNumeric(from: number | string, to: number | string): void {\n  if (!props.animate || props.loading) {\n    stopCounting()\n    frameValue.value = null\n    return\n  }\n\n  const target = toNumber(to)\n  const source = toNumber(from)\n\n  if (target === null || source === null) {\n    stopCounting()\n    frameValue.value = null\n    return\n  }\n\n  runCountUp(source, target)\n}\n\n// Появление плитки считается переходом от нуля: ради этого эффекта проп и нужен.\nonMounted(() => startIfNumeric(0, props.value))\n\nwatch(() => props.value, (next, prev) => startIfNumeric(prev, next))\n\nonBeforeUnmount(stopCounting)\n\nconst resolvedSize = useGrComponentSize(() => props.size, { component: 'GrStatistic' })\n\n// Иконка направления `aria-hidden`, а «+12,5 %» само по себе рост от падения не\n// отличает: направление доносит скрытая подпись.\nconst trendLabel = computed(() => {\n  if (!props.trend) return undefined\n\n  const labels = {\n    up: () => t('gr.statistic.trendUp', 'Increase'),\n    down: () => t('gr.statistic.trendDown', 'Decrease'),\n    flat: () => t('gr.statistic.trendFlat', 'No change'),\n  }\n\n  return labels[props.trend]()\n})\n</script>\n\n<template>\n  <component\n    :is=\"rootTag\"\n    data-gr-statistic\n    :type=\"rootTag === 'button' ? 'button' : undefined\"\n    :href=\"rootTag === 'a' ? href : undefined\"\n    :class=\"rootClass\"\n    @click=\"emit('click', $event)\"\n  >\n    <span\n      v-if=\"icon || $slots.icon\"\n      data-gr-statistic-icon\n      class=\"mt-0.5 inline-flex h-9 w-9 shrink-0 items-center justify-center rounded-[var(--gr-radius-lg)] bg-[var(--gr-muted)] text-[var(--gr-muted-fg)]\"\n    >\n      <slot name=\"icon\">\n        <span class=\"block h-4 w-4\" :class=\"icon\" aria-hidden=\"true\" />\n      </slot>\n    </span>\n\n    <div class=\"min-w-0\">\n      <!--\n        Подпись и значение — пара «термин — значение», а не два соседних блока.\n        `<dl>` появляется только вместе с подписью: список определений без `<dt>`\n        — та же бессвязность, только с претензией на семантику. Поля обнуляются\n        руками: preflight пакета сбрасывает их лишь у `body`.\n      -->\n      <component :is=\"hasTitle ? 'dl' : 'div'\" class=\"m-0\">\n        <dt\n          v-if=\"hasTitle\"\n          data-gr-statistic-title\n          :class=\"[statisticTitleClass, statisticTitleSizeBySize[resolvedSize]]\"\n        >\n          <slot name=\"title\">\n            {{ title }}\n          </slot>\n        </dt>\n\n        <!-- Плейсхолдер загрузки повторяет высоту строки значения, чтобы блок не прыгал. -->\n        <component\n          :is=\"hasTitle ? 'dd' : 'div'\"\n          v-if=\"loading\"\n          data-gr-statistic-placeholder\n          data-testid=\"gr-statistic-placeholder\"\n          class=\"m-0 mt-1\"\n          role=\"status\"\n          aria-busy=\"true\"\n        >\n          <GrSkeleton\n            width=\"6rem\"\n            :height=\"statisticPlaceholderHeightBySize[resolvedSize]\"\n            rounded=\"var(--gr-radius-md)\"\n          />\n          <span class=\"sr-only\">{{ t('gr.loading.defaultText', 'Loading...') }}</span>\n        </component>\n\n        <component\n          :is=\"hasTitle ? 'dd' : 'div'\"\n          v-else\n          data-gr-statistic-value\n          data-testid=\"gr-statistic-value\"\n          class=\"m-0 mt-0.5 flex items-baseline gap-1\"\n        >\n          <span\n            v-if=\"prefix || $slots.prefix\"\n            data-gr-statistic-prefix\n            class=\"text-[var(--gr-muted-fg)]\"\n            :class=\"statisticAffixSizeBySize[resolvedSize]\"\n          >\n            <slot name=\"prefix\">{{ prefix }}</slot>\n          </span>\n\n          <span\n            data-gr-statistic-number\n            :class=\"statisticValueClass({ size: resolvedSize, tone })\"\n            :aria-hidden=\"isCounting ? 'true' : undefined\"\n          >\n            <slot>{{ formatted }}</slot>\n          </span>\n\n          <!--\n            Пока идёт перебор, на экране промежуточное число. Диктору отдаётся\n            конечное: «1 284» глазами и «743» в ушах — не шум, а неверные данные.\n          -->\n          <span v-if=\"isCounting\" data-gr-statistic-final class=\"sr-only\">{{ finalFormatted }}</span>\n\n          <span\n            v-if=\"suffix || $slots.suffix\"\n            data-gr-statistic-suffix\n            class=\"text-[var(--gr-muted-fg)]\"\n            :class=\"statisticAffixSizeBySize[resolvedSize]\"\n          >\n            <slot name=\"suffix\">{{ suffix }}</slot>\n          </span>\n        </component>\n      </component>\n\n      <div\n        v-if=\"trend || trendText || $slots.trend\"\n        data-gr-statistic-trend\n        data-testid=\"gr-statistic-trend\"\n        class=\"mt-1 inline-flex items-center gap-1\"\n        :class=\"[statisticTrendSizeBySize[resolvedSize], statisticTrendClassByTrend[trend ?? 'flat']]\"\n      >\n        <span v-if=\"trendLabel\" data-gr-statistic-trend-label class=\"sr-only\">{{ trendLabel }}</span>\n\n        <slot name=\"trend\">\n          <span\n            v-if=\"trend\"\n            class=\"block h-3.5 w-3.5\"\n            :class=\"statisticTrendIconByTrend[trend]\"\n            aria-hidden=\"true\"\n          />\n          <span>{{ trendText }}</span>\n        </slot>\n      </div>\n    </div>\n  </component>\n</template>\n"],"mappings":"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"}

package/dist/components/GrStatistic/index.js

@@ -1,3 +1,3 @@
-import { n as formatStatisticValue, t as GrStatistic_default } from "./chunks/GrStatistic-gHiAwrX5.js";
-import { n as grStatisticSafelist, t as grStatisticConfig } from "../../chunks/config-BDSHekVC.js";
+import { n as formatStatisticValue, t as GrStatistic_default } from "./chunks/GrStatistic-CttyoYPT.js";
+import { n as grStatisticSafelist, t as grStatisticConfig } from "../../chunks/config-D8tSR2uS.js";
 export { GrStatistic_default as GrStatistic, GrStatistic_default as default, formatStatisticValue, grStatisticConfig, grStatisticSafelist };

package/dist/components/GrSwitch/chunks/GrSwitch-B9TYbiih.js

@@ -0,0 +1,183 @@
+import { o as useGrComponentSize } from "../../../chunks/context-BSYR7RZs.js";
+import { n as useGranularityTranslations } from "../../../chunks/granularityI18n-BC5zsj_d.js";
+import { t as loader_circle_default } from "../../../chunks/loader-circle-CfVLz7lb.js";
+import { n as useGrFormFieldContext } from "../../../chunks/context-DdNIxa1w.js";
+import { useGrFormControl } from "../../../composables/useGrFormControl.js";
+import { a as grSwitchSpinnerClass, i as grSwitchRootClass, o as grSwitchThumbClass, r as grSwitchLabelClass, s as grSwitchTrackClass } from "../../../chunks/config-BoNR7_PD.js";
+import { Fragment, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, defineComponent, mergeProps, normalizeClass, normalizeStyle, openBlock, ref, renderSlot, toDisplayString, unref } from "vue";
+//#region src/components/GrSwitch/GrSwitch.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1 = [
+	"name",
+	"value",
+	"form"
+];
+var _hoisted_2 = [
+	"id",
+	"aria-checked",
+	"aria-label",
+	"aria-describedby",
+	"aria-invalid",
+	"aria-required",
+	"aria-readonly",
+	"aria-busy",
+	"disabled"
+];
+var _hoisted_3 = {
+	key: 1,
+	"data-gr-switch-loading-text": "",
+	class: "sr-only"
+};
+//#endregion
+//#region src/components/GrSwitch/GrSwitch.vue
+var GrSwitch_default = /* @__PURE__ */ defineComponent({
+	inheritAttrs: false,
+	__name: "GrSwitch",
+	props: {
+		modelValue: { type: Boolean },
+		disabled: {
+			type: Boolean,
+			default: false
+		},
+		readonly: {
+			type: Boolean,
+			default: false
+		},
+		invalid: {
+			type: Boolean,
+			default: false
+		},
+		required: {
+			type: Boolean,
+			default: false
+		},
+		ariaLabel: { default: void 0 },
+		size: { default: void 0 },
+		labelPosition: { default: "end" },
+		loading: {
+			type: Boolean,
+			default: false
+		},
+		loadingText: { default: void 0 },
+		name: { default: void 0 },
+		value: { default: "on" },
+		form: { default: void 0 },
+		activeBackgroundColor: { default: void 0 },
+		inactiveBackgroundColor: { default: void 0 }
+	},
+	emits: [
+		"update:modelValue",
+		"change",
+		"focus",
+		"blur"
+	],
+	setup(__props, { expose: __expose, emit: __emit }) {
+		const getCustomColor = (value) => value?.trim() || void 0;
+		const props = __props;
+		const field = useGrFormFieldContext();
+		const fieldId = computed(() => field?.id.value);
+		const describedBy = computed(() => field?.describedById.value);
+		const { disabled: isDisabled, invalid: isInvalid, required: isRequired, readonly: isReadonly } = useGrFormControl(() => props);
+		const { t } = useGranularityTranslations();
+		const rootEl = ref(null);
+		function focus() {
+			rootEl.value?.focus();
+		}
+		function blur() {
+			rootEl.value?.blur();
+		}
+		__expose({
+			focus,
+			blur
+		});
+		const resolvedSize = useGrComponentSize(() => props.size, {
+			component: "GrSwitch",
+			supported: [
+				"xs",
+				"sm",
+				"md",
+				"lg"
+			]
+		});
+		const emit = __emit;
+		const rootClass = computed(() => grSwitchRootClass(props.labelPosition));
+		const trackClass = computed(() => grSwitchTrackClass(resolvedSize.value));
+		const trackStyle = computed(() => {
+			const isChecked = props.modelValue;
+			const defaultBackgroundColor = isChecked ? "var(--gr-primary)" : "var(--gr-muted)";
+			const customBackgroundColor = getCustomColor(isChecked ? props.activeBackgroundColor : props.inactiveBackgroundColor);
+			const backgroundColor = isDisabled.value ? "var(--gr-disabled-bg)" : customBackgroundColor ?? defaultBackgroundColor;
+			return {
+				"--gr-switch-track-bg": backgroundColor,
+				"--gr-switch-track-brd": isDisabled.value ? "var(--gr-disabled-brd)" : customBackgroundColor ? backgroundColor : isChecked ? "var(--gr-primary)" : "var(--gr-brd)",
+				backgroundColor: "var(--gr-switch-track-bg)"
+			};
+		});
+		const thumbClass = computed(() => grSwitchThumbClass({
+			size: resolvedSize.value,
+			checked: props.modelValue
+		}));
+		const spinnerClass = computed(() => grSwitchSpinnerClass(resolvedSize.value));
+		const labelClass = computed(() => grSwitchLabelClass(resolvedSize.value, isDisabled.value));
+		const resolvedLoadingText = computed(() => props.loadingText ?? t("gr.switch.loading", "Saving…"));
+		const submitsValue = computed(() => props.modelValue && !isDisabled.value && Boolean(props.name));
+		function toggle() {
+			if (isDisabled.value || isReadonly.value || props.loading) return;
+			const next = !props.modelValue;
+			emit("update:modelValue", next);
+			emit("change", next);
+		}
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock(Fragment, null, [submitsValue.value ? (openBlock(), createElementBlock("input", {
+				key: 0,
+				type: "hidden",
+				name: __props.name,
+				value: __props.value,
+				form: __props.form
+			}, null, 8, _hoisted_1)) : createCommentVNode("", true), createElementVNode("button", mergeProps({
+				id: fieldId.value,
+				ref_key: "rootEl",
+				ref: rootEl
+			}, _ctx.$attrs, {
+				type: "button",
+				role: "switch",
+				"data-gr-switch": "",
+				"aria-checked": __props.modelValue ? "true" : "false",
+				"aria-label": __props.ariaLabel,
+				"aria-describedby": describedBy.value,
+				"aria-invalid": unref(isInvalid) ? "true" : void 0,
+				"aria-required": unref(isRequired) ? "true" : void 0,
+				"aria-readonly": unref(isReadonly) ? "true" : void 0,
+				"aria-busy": __props.loading ? "true" : void 0,
+				disabled: unref(isDisabled),
+				class: rootClass.value,
+				onClick: toggle,
+				onFocus: _cache[0] || (_cache[0] = ($event) => emit("focus", $event)),
+				onBlur: _cache[1] || (_cache[1] = ($event) => emit("blur", $event))
+			}), [
+				createElementVNode("span", {
+					"data-testid": "gr-switch-track",
+					"data-gr-switch-track": "",
+					class: normalizeClass(trackClass.value),
+					style: normalizeStyle(trackStyle.value)
+				}, [createElementVNode("span", {
+					"data-testid": "gr-switch-thumb",
+					"data-gr-switch-thumb": "",
+					class: normalizeClass(thumbClass.value),
+					"aria-hidden": "true"
+				}, [__props.loading ? (openBlock(), createBlock(unref(loader_circle_default), {
+					key: 0,
+					"data-gr-switch-spinner": "",
+					class: normalizeClass(spinnerClass.value)
+				}, null, 8, ["class"])) : createCommentVNode("", true)], 2)], 6),
+				_ctx.$slots.default ? (openBlock(), createElementBlock("span", {
+					key: 0,
+					"data-gr-switch-label": "",
+					class: normalizeClass(labelClass.value)
+				}, [renderSlot(_ctx.$slots, "default")], 2)) : createCommentVNode("", true),
+				__props.loading ? (openBlock(), createElementBlock("span", _hoisted_3, toDisplayString(resolvedLoadingText.value), 1)) : createCommentVNode("", true)
+			], 16, _hoisted_2)], 64);
+		};
+	}
+});
+//#endregion
+export { GrSwitch_default as t };