@feugene/granularity 0.48.0 → 0.49.0

package/dist/components/GrAutocomplete/index.js

@@ -1,3 +1,3 @@
-import { t as GrAutocomplete_default } from "./chunks/GrAutocomplete-C-uovdv8.js";
+import { t as GrAutocomplete_default } from "./chunks/GrAutocomplete-Chhw65pI.js";
 import { n as grAutocompleteSafelist, t as grAutocompleteConfig } from "../../chunks/config-BHLMTJaR.js";
 export { GrAutocomplete_default as GrAutocomplete, GrAutocomplete_default as default, grAutocompleteConfig, grAutocompleteSafelist };

package/dist/components/GrBadge/chunks/GrBadge-C42KLyUD.js

@@ -0,0 +1,71 @@
+import { i as useGrComponentProp } from "../../../chunks/context-CPMRfwVr.js";
+import { t as warnRenamedProp } from "../../../chunks/renamedProp-Dy96tT-F.js";
+import { l as grBadgeClass, n as badgeDotClassFor, o as badgeIconClass, s as badgeIconSizeClassBySize } from "../../../chunks/grBadgeStyles-D51AXbj5.js";
+import { t as _plugin_vue_export_helper_default } from "../../../chunks/_plugin-vue_export-helper-BOaGB7Aw.js";
+import { computed, createCommentVNode, createElementBlock, createElementVNode, defineComponent, normalizeClass, openBlock, renderSlot, unref, useAttrs, useSlots, watchEffect } from "vue";
+import '../styles.css';//#region src/components/GrBadge/GrBadge.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1 = { class: "gr-badge__label" };
+var _hoisted_2 = { class: "gr-badge__text" };
+//#endregion
+//#region src/components/GrBadge/GrBadge.vue
+var GrBadge_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE__ */ defineComponent({
+	__name: "GrBadge",
+	props: {
+		tone: { default: void 0 },
+		dark: {
+			type: Boolean,
+			default: false
+		},
+		size: { default: void 0 },
+		radius: { default: void 0 },
+		dot: {
+			type: [String, Boolean],
+			default: false
+		}
+	},
+	setup(__props) {
+		const props = __props;
+		const slots = useSlots();
+		const resolvedTone = useGrComponentProp("GrBadge", "tone", () => props.tone, "neutral");
+		const resolvedSize = useGrComponentProp("GrBadge", "size", () => props.size, "sm");
+		const resolvedRadius = useGrComponentProp("GrBadge", "radius", () => props.radius, "round");
+		warnRenamedProp("GrBadge", useAttrs(), { variant: "tone" });
+		const className = computed(() => {
+			return grBadgeClass({
+				tone: resolvedTone.value,
+				dark: props.dark,
+				size: resolvedSize.value,
+				radius: resolvedRadius.value
+			});
+		});
+		const iconSizeClass = computed(() => badgeIconSizeClassBySize[resolvedSize.value]);
+		const showDot = computed(() => Boolean(props.dot) && !slots.icon);
+		const dotClass = computed(() => badgeDotClassFor({
+			tone: typeof props.dot === "string" ? props.dot : resolvedTone.value,
+			dark: props.dark,
+			size: resolvedSize.value
+		}));
+		if (process.env.NODE_ENV !== "production") watchEffect(() => {
+			if (props.dot && slots.icon) console.warn("[granularity] GrBadge: `dot` и слот `icon` заняли бы одно место перед подписью — нарисована иконка, маркер пропущен.");
+			if (props.dark && typeof props.dot === "string") console.warn(`[granularity] GrBadge: маркер тона \`${props.dot}\` на заливке не рисуется — подложка filled-бейджа берётся из того же слоя цветов, и маркер слился бы с ней. На заливке он всегда цвета текста.`);
+		});
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("span", { class: normalizeClass(["gr-badge inline-block border whitespace-nowrap leading-none", className.value]) }, [createElementVNode("span", _hoisted_1, [
+				showDot.value ? (openBlock(), createElementBlock("span", {
+					key: 0,
+					"data-gr-badge-dot": "",
+					class: normalizeClass(dotClass.value),
+					"aria-hidden": "true"
+				}, null, 2)) : createCommentVNode("", true),
+				_ctx.$slots.icon ? (openBlock(), createElementBlock("span", {
+					key: 1,
+					"data-gr-badge-icon": "",
+					class: normalizeClass([unref(badgeIconClass), iconSizeClass.value])
+				}, [renderSlot(_ctx.$slots, "icon", {}, void 0, true)], 2)) : createCommentVNode("", true),
+				createElementVNode("span", _hoisted_2, [renderSlot(_ctx.$slots, "default", {}, void 0, true)])
+			])], 2);
+		};
+	}
+}), [["__scopeId", "data-v-cbcfb89e"]]);
+//#endregion
+export { GrBadge_default as t };

package/dist/components/GrBadge/chunks/GrBadge-C42KLyUD.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"GrBadge-C42KLyUD.js","names":["$slots"],"sources":["../../../../src/components/GrBadge/GrBadge.vue","../../../../src/components/GrBadge/GrBadge.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, useAttrs, watchEffect } from 'vue'\n\nimport { useGrComponentProp } from '../GrConfigProvider/context'\n\nexport type { GrBadgeRadius, GrBadgeSize, GrBadgeTone } from './grBadgeStyles'\n\nimport { warnRenamedProp } from '../shared/renamedProp'\n\nimport {\n  badgeDotClassFor,\n  badgeIconClass,\n  badgeIconSizeClassBySize,\n  grBadgeClass,\n  type GrBadgeDotTone,\n  type GrBadgeRadius,\n  type GrBadgeSize,\n  type GrBadgeTone,\n} from './grBadgeStyles'\n\nexport interface GrBadgeProps {\n  tone?: GrBadgeTone\n  dark?: boolean\n  size?: GrBadgeSize\n  radius?: GrBadgeRadius\n  /**\n   * Точка-маркер перед подписью: «● Активен».\n   *\n   * Имя тона красит маркер отдельно от плашки — ради пары «тихая плашка +\n   * цветной маркер», из-за которой паттерн и существует. `true` берёт тон\n   * самого бейджа.\n   *\n   * На заливке (`dark`) маркер всегда цвета текста: тон там слился бы с\n   * подложкой, взятой из того же слоя.\n   */\n  dot?: GrBadgeDotTone | boolean\n}\n\nconst props = withDefaults(\n  defineProps<GrBadgeProps>(),\n  {\n    // `tone`/`size`/`radius` настраиваются через `GrConfigProvider`, поэтому\n    // их дефолты живут в резолверах ниже, а не в `withDefaults`.\n    tone: undefined,\n    dark: false,\n    size: undefined,\n    radius: undefined,\n    dot: false,\n  },\n)\n\nconst slots = defineSlots<{\n  /** Содержимое метки. */\n  default?: () => any\n  /**\n   * Иконка перед подписью: статус со спиннером, флаг, значок типа.\n   *\n   * Размер задаёт обёртка по ступени `size`, поэтому содержимое слота тянется\n   * до неё — `class=\"h-full w-full\"`, как у `GrChip`. Вращение спиннера —\n   * `animate-spin` на самой иконке.\n   *\n   * `GrProgressCircle` сюда не кладут: у кругового индикатора шкала виджетная,\n   * нижняя ступень — `2rem`, и в строку бейджа он не помещается.\n   */\n  icon?: () => any\n}>()\n\n// Эффективные значения: локальный проп → `GrConfigProvider` → дефолт компонента.\nconst resolvedTone = useGrComponentProp('GrBadge', 'tone', () => props.tone, 'neutral')\nconst resolvedSize = useGrComponentProp('GrBadge', 'size', () => props.size, 'sm')\nconst resolvedRadius = useGrComponentProp('GrBadge', 'radius', () => props.radius, 'round')\n\n// `variant` переименован в `tone`: незнакомый атрибут Vue сажает на корневой\n// узел, поэтому старое имя не роняет ни типы, ни рантайм — компонент молча\n// рисуется дефолтным тоном.\nwarnRenamedProp('GrBadge', useAttrs(), { variant: 'tone' })\n\nconst className = computed(() => {\n  return grBadgeClass({\n    tone: resolvedTone.value,\n    dark: props.dark,\n    size: resolvedSize.value,\n    radius: resolvedRadius.value,\n  })\n})\n\nconst iconSizeClass = computed(() => badgeIconSizeClassBySize[resolvedSize.value])\n\n// Иконка и маркер стоят на одном месте и говорят об одном; два подряд — шум.\n// Выигрывает иконка: она несёт больше, чем цвет.\nconst showDot = computed(() => Boolean(props.dot) && !slots.icon)\n\nconst dotClass = computed(() => badgeDotClassFor({\n  tone: typeof props.dot === 'string' ? props.dot : resolvedTone.value,\n  dark: props.dark,\n  size: resolvedSize.value,\n}))\n\nif (__GR_DEV__) {\n  watchEffect(() => {\n    if (props.dot && slots.icon) {\n      console.warn(\n        '[granularity] GrBadge: `dot` и слот `icon` заняли бы одно место перед подписью — '\n        + 'нарисована иконка, маркер пропущен.',\n      )\n    }\n\n    if (props.dark && typeof props.dot === 'string') {\n      console.warn(\n        `[granularity] GrBadge: маркер тона \\`${props.dot}\\` на заливке не рисуется — `\n        + 'подложка filled-бейджа берётся из того же слоя цветов, и маркер слился бы с ней. '\n        + 'На заливке он всегда цвета текста.',\n      )\n    }\n  })\n}\n</script>\n\n<template>\n  <span\n      class=\"gr-badge inline-block border whitespace-nowrap leading-none\"\n      :class=\"className\"\n  >\n    <span class=\"gr-badge__label\">\n      <span\n        v-if=\"showDot\"\n        data-gr-badge-dot\n        :class=\"dotClass\"\n        aria-hidden=\"true\"\n      />\n      <span\n        v-if=\"$slots.icon\"\n        data-gr-badge-icon\n        :class=\"[badgeIconClass, iconSizeClass]\"\n      >\n        <slot name=\"icon\" />\n      </span>\n      <span class=\"gr-badge__text\">\n        <slot />\n      </span>\n    </span>\n  </span>\n</template>\n\n<style scoped>\n/*\n * Оптически центрируем текст по вертикали независимо от регистра,\n * не уменьшая высоту самого бейджа.\n *\n * Высоту держит обёртка `.gr-badge__label` (`min-height: 1lh` — высота\n * line-box при `leading-none`), а текст (`.gr-badge__text`) обрезается до\n * cap-height и центрируется внутри этой высоты через flex.\n *\n * Обрезка обязана жить на вложенном узле, а не на самом тексте: `text-box-trim`\n * уменьшает line-box, и повесь его прямо на текст — вместе с ним просядет\n * высота контента, а за ней и весь бейдж.\n *\n * `gap` задан в `em`, чтобы просвет перед маркером или иконкой шёл за кеглем\n * ступени, а не за корневым размером. Бейджа без них он не касается: у\n * flex-контейнера с единственным ребёнком просветов нет.\n */\n.gr-badge__label {\n  display: flex;\n  align-items: center;\n  gap: 0.25em;\n  min-height: 1lh;\n}\n\n.gr-badge__text {\n  display: block;\n  text-box-trim: trim-both;\n  text-box-edge: cap alphabetic;\n  /* Шорткат для браузеров с поддержкой нового синтаксиса. */\n  text-box: trim-both cap alphabetic;\n}\n</style>\n","<script setup lang=\"ts\">\nimport { computed, useAttrs, watchEffect } from 'vue'\n\nimport { useGrComponentProp } from '../GrConfigProvider/context'\n\nexport type { GrBadgeRadius, GrBadgeSize, GrBadgeTone } from './grBadgeStyles'\n\nimport { warnRenamedProp } from '../shared/renamedProp'\n\nimport {\n  badgeDotClassFor,\n  badgeIconClass,\n  badgeIconSizeClassBySize,\n  grBadgeClass,\n  type GrBadgeDotTone,\n  type GrBadgeRadius,\n  type GrBadgeSize,\n  type GrBadgeTone,\n} from './grBadgeStyles'\n\nexport interface GrBadgeProps {\n  tone?: GrBadgeTone\n  dark?: boolean\n  size?: GrBadgeSize\n  radius?: GrBadgeRadius\n  /**\n   * Точка-маркер перед подписью: «● Активен».\n   *\n   * Имя тона красит маркер отдельно от плашки — ради пары «тихая плашка +\n   * цветной маркер», из-за которой паттерн и существует. `true` берёт тон\n   * самого бейджа.\n   *\n   * На заливке (`dark`) маркер всегда цвета текста: тон там слился бы с\n   * подложкой, взятой из того же слоя.\n   */\n  dot?: GrBadgeDotTone | boolean\n}\n\nconst props = withDefaults(\n  defineProps<GrBadgeProps>(),\n  {\n    // `tone`/`size`/`radius` настраиваются через `GrConfigProvider`, поэтому\n    // их дефолты живут в резолверах ниже, а не в `withDefaults`.\n    tone: undefined,\n    dark: false,\n    size: undefined,\n    radius: undefined,\n    dot: false,\n  },\n)\n\nconst slots = defineSlots<{\n  /** Содержимое метки. */\n  default?: () => any\n  /**\n   * Иконка перед подписью: статус со спиннером, флаг, значок типа.\n   *\n   * Размер задаёт обёртка по ступени `size`, поэтому содержимое слота тянется\n   * до неё — `class=\"h-full w-full\"`, как у `GrChip`. Вращение спиннера —\n   * `animate-spin` на самой иконке.\n   *\n   * `GrProgressCircle` сюда не кладут: у кругового индикатора шкала виджетная,\n   * нижняя ступень — `2rem`, и в строку бейджа он не помещается.\n   */\n  icon?: () => any\n}>()\n\n// Эффективные значения: локальный проп → `GrConfigProvider` → дефолт компонента.\nconst resolvedTone = useGrComponentProp('GrBadge', 'tone', () => props.tone, 'neutral')\nconst resolvedSize = useGrComponentProp('GrBadge', 'size', () => props.size, 'sm')\nconst resolvedRadius = useGrComponentProp('GrBadge', 'radius', () => props.radius, 'round')\n\n// `variant` переименован в `tone`: незнакомый атрибут Vue сажает на корневой\n// узел, поэтому старое имя не роняет ни типы, ни рантайм — компонент молча\n// рисуется дефолтным тоном.\nwarnRenamedProp('GrBadge', useAttrs(), { variant: 'tone' })\n\nconst className = computed(() => {\n  return grBadgeClass({\n    tone: resolvedTone.value,\n    dark: props.dark,\n    size: resolvedSize.value,\n    radius: resolvedRadius.value,\n  })\n})\n\nconst iconSizeClass = computed(() => badgeIconSizeClassBySize[resolvedSize.value])\n\n// Иконка и маркер стоят на одном месте и говорят об одном; два подряд — шум.\n// Выигрывает иконка: она несёт больше, чем цвет.\nconst showDot = computed(() => Boolean(props.dot) && !slots.icon)\n\nconst dotClass = computed(() => badgeDotClassFor({\n  tone: typeof props.dot === 'string' ? props.dot : resolvedTone.value,\n  dark: props.dark,\n  size: resolvedSize.value,\n}))\n\nif (__GR_DEV__) {\n  watchEffect(() => {\n    if (props.dot && slots.icon) {\n      console.warn(\n        '[granularity] GrBadge: `dot` и слот `icon` заняли бы одно место перед подписью — '\n        + 'нарисована иконка, маркер пропущен.',\n      )\n    }\n\n    if (props.dark && typeof props.dot === 'string') {\n      console.warn(\n        `[granularity] GrBadge: маркер тона \\`${props.dot}\\` на заливке не рисуется — `\n        + 'подложка filled-бейджа берётся из того же слоя цветов, и маркер слился бы с ней. '\n        + 'На заливке он всегда цвета текста.',\n      )\n    }\n  })\n}\n</script>\n\n<template>\n  <span\n      class=\"gr-badge inline-block border whitespace-nowrap leading-none\"\n      :class=\"className\"\n  >\n    <span class=\"gr-badge__label\">\n      <span\n        v-if=\"showDot\"\n        data-gr-badge-dot\n        :class=\"dotClass\"\n        aria-hidden=\"true\"\n      />\n      <span\n        v-if=\"$slots.icon\"\n        data-gr-badge-icon\n        :class=\"[badgeIconClass, iconSizeClass]\"\n      >\n        <slot name=\"icon\" />\n      </span>\n      <span class=\"gr-badge__text\">\n        <slot />\n      </span>\n    </span>\n  </span>\n</template>\n\n<style scoped>\n/*\n * Оптически центрируем текст по вертикали независимо от регистра,\n * не уменьшая высоту самого бейджа.\n *\n * Высоту держит обёртка `.gr-badge__label` (`min-height: 1lh` — высота\n * line-box при `leading-none`), а текст (`.gr-badge__text`) обрезается до\n * cap-height и центрируется внутри этой высоты через flex.\n *\n * Обрезка обязана жить на вложенном узле, а не на самом тексте: `text-box-trim`\n * уменьшает line-box, и повесь его прямо на текст — вместе с ним просядет\n * высота контента, а за ней и весь бейдж.\n *\n * `gap` задан в `em`, чтобы просвет перед маркером или иконкой шёл за кеглем\n * ступени, а не за корневым размером. Бейджа без них он не касается: у\n * flex-контейнера с единственным ребёнком просветов нет.\n */\n.gr-badge__label {\n  display: flex;\n  align-items: center;\n  gap: 0.25em;\n  min-height: 1lh;\n}\n\n.gr-badge__text {\n  display: block;\n  text-box-trim: trim-both;\n  text-box-edge: cap alphabetic;\n  /* Шорткат для браузеров с поддержкой нового синтаксиса. */\n  text-box: trim-both cap alphabetic;\n}\n</style>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;EAsCA,MAAM,QAAQ;EAad,MAAM,QAAQ,SAAA;EAiBd,MAAM,eAAe,mBAAmB,WAAW,cAAc,MAAM,MAAM,SAAS;EACtF,MAAM,eAAe,mBAAmB,WAAW,cAAc,MAAM,MAAM,IAAI;EACjF,MAAM,iBAAiB,mBAAmB,WAAW,gBAAgB,MAAM,QAAQ,OAAO;EAK1F,gBAAgB,WAAW,SAAS,GAAG,EAAE,SAAS,OAAO,CAAC;EAE1D,MAAM,YAAY,eAAe;GAC/B,OAAO,aAAa;IAClB,MAAM,aAAa;IACnB,MAAM,MAAM;IACZ,MAAM,aAAa;IACnB,QAAQ,eAAe;GACzB,CAAC;EACH,CAAC;EAED,MAAM,gBAAgB,eAAe,yBAAyB,aAAa,MAAM;EAIjF,MAAM,UAAU,eAAe,QAAQ,MAAM,GAAG,KAAK,CAAC,MAAM,IAAI;EAEhE,MAAM,WAAW,eAAe,iBAAiB;GAC/C,MAAM,OAAO,MAAM,QAAQ,WAAW,MAAM,MAAM,aAAa;GAC/D,MAAM,MAAM;GACZ,MAAM,aAAa;EACrB,CAAC,CAAC;EAEF,IAAA,QAAA,IAAA,aAAA,cACE,kBAAkB;GAChB,IAAI,MAAM,OAAO,MAAM,MACrB,QAAQ,KACN,sHAEF;GAGF,IAAI,MAAM,QAAQ,OAAO,MAAM,QAAQ,UACrC,QAAQ,KACN,wCAAwC,MAAM,IAAI,gJAGpD;EAEJ,CAAC;;GAKD,OAAA,UAAA,GAAA,mBAsBO,QAAA,EArBH,OAAK,eAAA,CAAC,+DACE,UAAA,KAAS,CAAA,EAAA,GAAA,CAEnB,mBAiBO,QAjBP,YAiBO;IAfG,QAAA,SADR,UAAA,GAAA,mBAKE,QAAA;;KAHA,qBAAA;KACC,OAAK,eAAE,SAAA,KAAQ;KAChB,eAAY;;IAGNA,KAAAA,OAAO,QADf,UAAA,GAAA,mBAMO,QAAA;;KAJL,sBAAA;KACC,OAAK,eAAA,CAAG,MAAA,cAAA,GAAgB,cAAA,KAAa,CAAA;IAEtC,GAAA,CAAA,WAAoB,KAAA,QAAA,QAAA,CAAA,GAAA,KAAA,GAAA,IAAA,CAAA,GAAA,CAAA,KAAA,mBAAA,IAAA,IAAA;IAEtB,mBAEO,QAFP,YAEO,CADL,WAAQ,KAAA,QAAA,WAAA,CAAA,GAAA,KAAA,GAAA,IAAA,CAAA,CAAA"}

package/dist/components/GrBadge/index.js

@@ -1,4 +1,4 @@
-import { t as GrBadge_default } from "./chunks/GrBadge-DBeQXEir.js";
-import { t as grBadgeSafelist } from "../../chunks/safelist-x8USecK8.js";
-import { t as grBadgeConfig } from "../../chunks/config-BscVxZR3.js";
+import { t as GrBadge_default } from "./chunks/GrBadge-C42KLyUD.js";
+import { t as grBadgeSafelist } from "../../chunks/safelist-CSfynUC1.js";
+import { t as grBadgeConfig } from "../../chunks/config-DF1ezU6y.js";
 export { GrBadge_default as GrBadge, GrBadge_default as default, grBadgeConfig, grBadgeSafelist };

package/dist/components/GrBadge/styles.css

@@ -1 +1 @@
-.gr-badge__label[data-v-78f3036a]{align-items:center;gap:.25em;min-height:1lh;display:flex}.gr-badge__text[data-v-78f3036a]{text-box-trim:trim-both;text-box-edge:cap alphabetic;text-box:trim-both cap alphabetic;display:block}
+.gr-badge__label[data-v-cbcfb89e]{align-items:center;gap:.25em;min-height:1lh;display:flex}.gr-badge__text[data-v-cbcfb89e]{text-box-trim:trim-both;text-box-edge:cap alphabetic;text-box:trim-both cap alphabetic;display:block}

package/dist/components/GrChip/chunks/{GrChip-CKqyzYcv.js → GrChip-DoyS1Dr4.js}

@@ -3,7 +3,7 @@ import { a as useGrComponentSize, i as useGrComponentProp } from "../../../chunk
 import { n as useGranularityTranslations } from "../../../chunks/granularityI18n-BC5zsj_d.js";
 import { t as warnRenamedProp } from "../../../chunks/renamedProp-Dy96tT-F.js";
 import { t as GR_CHIP_GROUP_CONTEXT } from "../../../chunks/grChipGroupContext-DZXkACap.js";
-import { a as chipIconSizeClassBySize, f as grChipClass, i as chipIconClass, n as chipCloseClass, s as chipLabelClass, t as chipCloseButtonClass } from "../../../chunks/grChipStyles-DcDyxAL0.js";
+import { a as chipIconSizeClassBySize, f as grChipClass, i as chipIconClass, n as chipCloseClass, s as chipLabelClass, t as chipCloseButtonClass } from "../../../chunks/grChipStyles-CA9Wj1_E.js";
 import { computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, createVNode, defineComponent, inject, normalizeClass, onBeforeUnmount, openBlock, ref, renderSlot, resolveDynamicComponent, toDisplayString, unref, useAttrs, withCtx, withModifiers } from "vue";
 //#region src/components/GrChip/GrChip.vue?vue&type=script&setup=true&lang.ts
 var _hoisted_1 = ["title"];

package/dist/components/GrChip/chunks/{GrChip-CKqyzYcv.js.map → GrChip-DoyS1Dr4.js.map}

@@ -1 +1 @@
-{"version":3,"file":"GrChip-CKqyzYcv.js","names":["$slots"],"sources":["../../../../src/components/GrChip/GrChip.vue","../../../../src/components/GrChip/GrChip.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, inject, onBeforeUnmount, ref, useAttrs } from 'vue'\n\nimport IconClose from '~icons/lucide/x'\n\nimport { useGranularityTranslations } from '../../internal/granularityI18n'\nimport { useGrComponentProp, useGrComponentSize } from '../GrConfigProvider/context'\n\nimport type { GrChipValue } from './grChipGroupContext'\n\nimport { warnRenamedProp } from '../shared/renamedProp'\nimport { GR_CHIP_GROUP_CONTEXT } from './grChipGroupContext'\nimport type { GrChipRadius, GrChipSize, GrChipTone } from './grChipStyles'\nimport {\n  chipCloseButtonClass,\n  chipCloseClass,\n  chipIconClass,\n  chipIconSizeClassBySize,\n  chipLabelClass,\n  grChipClass,\n} from './grChipStyles'\n\n/**\n * Интерактивный тег: снимаемый, выбираемый, с иконкой.\n *\n * От `GrBadge` отличается не видом, а природой: бейдж — метка, чип — виджет.\n * Поэтому цвета и радиусы взяты у бейджа как есть (в одном ряду они обязаны\n * совпадать), а роль, клавиатура и размеры — свои.\n */\nexport interface GrChipProps {\n  /** Значение чипа в группе. Вне `GrChipGroup` не используется. */\n  value?: GrChipValue\n  /**\n   * Подпись. Нужна отдельно от слота: из неё собирается имя кнопки снятия —\n   * «Убрать» на двадцати кнопках подряд не даёт выбрать нужную.\n   */\n  label?: string\n  tone?: GrChipTone\n  dark?: boolean\n  size?: GrChipSize\n  radius?: GrChipRadius\n  /** Чип становится переключателем: `aria-pressed`, `Enter`/`Space`. */\n  selectable?: boolean\n  /** Состояние переключателя вне группы. Внутри группы значение ведёт группа. */\n  selected?: boolean\n  /** Крестик. Внутри виджета он не кнопка — см. блок про роли ниже. */\n  closable?: boolean\n  disabled?: boolean\n  /** Доступное имя, когда подпись не объясняет назначения. */\n  ariaLabel?: string\n  /** Имя кнопки снятия целиком. Перебивает собранное из `label`. */\n  removeLabel?: string\n  /**\n   * `tabindex` кнопки снятия — для чипа внутри поля ввода.\n   *\n   * Там таб-стоп принадлежит `<input>`, а ряд чипов ходит стрелками: у\n   * `GrInputTag` кольцо оставляет ровно один `0`, у `GrAutocomplete` их нет\n   * вовсе. Проп нужен потому, что кольцом управляет родитель — он знает и\n   * порядок чипов, и что стоит за краем ряда.\n   */\n  removeTabindex?: number\n}\n\nexport interface GrChipEmits {\n  (e: 'update:selected', value: boolean): void\n  (e: 'remove'): void\n}\n\nconst props = withDefaults(defineProps<GrChipProps>(), {\n  value: undefined,\n  label: undefined,\n  // Дефолты живут в резолверах ниже: Vue подставил бы свой раньше, чем\n  // компонент заглянет в `GrConfigProvider`.\n  tone: undefined,\n  dark: undefined,\n  size: undefined,\n  radius: undefined,\n  selectable: false,\n  selected: false,\n  closable: false,\n  disabled: false,\n  ariaLabel: undefined,\n  removeLabel: undefined,\n  removeTabindex: undefined,\n})\n\nconst emit = defineEmits<GrChipEmits>()\n\n// `variant` переименован в `tone`: незнакомый атрибут Vue сажает на корневой\n// узел, поэтому старое имя не роняет ни типы, ни рантайм — компонент молча\n// рисуется дефолтным тоном.\nwarnRenamedProp('GrChip', useAttrs(), { variant: 'tone' })\n\ndefineSlots<{\n  /** Подпись чипа. Внутри выбираемого чипа — только фразовое содержимое. */\n  default?: () => unknown\n  /** Иконка перед подписью. */\n  icon?: () => unknown\n}>()\n\nconst { t } = useGranularityTranslations()\n\nconst group = inject(GR_CHIP_GROUP_CONTEXT, null)\nconst rootEl = ref<HTMLElement | null>(null)\n\nconst inGroup = computed(() => group !== null && props.value !== undefined)\n\nconst isDisabled = computed(() => props.disabled || (group?.disabled.value ?? false))\nconst isReadonly = computed(() => group?.readonly.value ?? false)\n\n/**\n * Чип — виджет ровно тогда, когда по нему кликают.\n *\n * От этого зависит вся разметка: у виджета роль, `tabindex` и клавиатура, а\n * крестик внутри него перестаёт быть кнопкой.\n */\nconst isInteractive = computed(() => inGroup.value || props.selectable)\n\nconst isSelected = computed(() => {\n  if (inGroup.value && props.value !== undefined)\n    return group!.isSelected(props.value)\n  return props.selected\n})\n\nconst isClosable = computed(() => {\n  if (isReadonly.value || isDisabled.value)\n    return false\n  return props.closable || (inGroup.value ? group!.closable.value : false)\n})\n\n// Приоритет: локальный проп → значение группы → `GrConfigProvider` → дефолт.\n// Группа специфичнее конфига, поэтому её значение подаётся как «локальное».\nconst resolvedSize = useGrComponentSize<GrChipSize>(\n  () => props.size ?? (inGroup.value ? group!.size.value : undefined),\n  { component: 'GrChip' },\n)\nconst resolvedTone = useGrComponentProp(\n  'GrChip',\n  'tone',\n  () => props.tone ?? (inGroup.value ? group!.tone.value : undefined),\n  'neutral',\n)\nconst resolvedRadius = useGrComponentProp(\n  'GrChip',\n  'radius',\n  () => props.radius ?? (inGroup.value ? group!.radius.value : undefined),\n  'round',\n)\nconst resolvedDark = useGrComponentProp(\n  'GrChip',\n  'dark',\n  () => props.dark ?? (inGroup.value ? group!.dark.value : undefined),\n  false,\n)\n\nconst rootClass = computed(() => grChipClass({\n  tone: resolvedTone.value,\n  dark: resolvedDark.value,\n  size: resolvedSize.value,\n  radius: resolvedRadius.value,\n  interactive: isInteractive.value && !isReadonly.value,\n  selected: isSelected.value,\n  disabled: isDisabled.value,\n}))\n\nconst iconSizeClass = computed(() => chipIconSizeClassBySize[resolvedSize.value])\n\nconst removeTitle = computed(() => {\n  if (props.removeLabel)\n    return props.removeLabel\n  if (props.label)\n    return t('gr.chip.removeNamed', 'Remove {label}', { label: props.label })\n  return t('gr.chip.remove', 'Remove')\n})\n\n/**\n * Роль чипа задаёт группа, а не потребитель.\n *\n * Одиночный переключатель — кнопка с `aria-pressed`; в группе роль зависит от\n * множественности выбора: `radio` в одиночной (образец — `GrSegmented`),\n * `option` во множественной, где контейнер объявлен `listbox` c\n * `aria-multiselectable`.\n */\nconst chipRole = computed(() => {\n  if (!inGroup.value)\n    return undefined\n  return group!.selection.value === 'single' ? 'radio' : 'option'\n})\n\nconst tabindex = computed(() => {\n  if (!isInteractive.value)\n    return undefined\n  if (isDisabled.value)\n    return -1\n  if (!inGroup.value || props.value === undefined)\n    return 0\n  return group!.rovingValue.value === props.value ? 0 : -1\n})\n\nfunction toggle(): void {\n  if (isDisabled.value || isReadonly.value)\n    return\n\n  if (inGroup.value && props.value !== undefined) {\n    group!.toggle(props.value)\n    return\n  }\n\n  if (props.selectable)\n    emit('update:selected', !props.selected)\n}\n\nfunction requestRemove(): void {\n  if (!isClosable.value)\n    return\n\n  emit('remove')\n  if (inGroup.value && props.value !== undefined)\n    group!.requestRemove(props.value)\n}\n\n/**\n * Крестик внутри виджета — не кнопка, поэтому его клик приходит сюда же и\n * разбирается по цели. Тот же приём у `GrTabs`: внутрь роли-виджета вложенная\n * кнопка запрещена (axe: `nested-interactive`), а `<button>` внутри `<button>`\n * невалиден и по контент-модели HTML.\n */\nfunction onRootClick(event: MouseEvent): void {\n  if (isDisabled.value)\n    return\n\n  if (event.target instanceof Element && event.target.closest('[data-gr-chip-close]')) {\n    requestRemove()\n    return\n  }\n\n  toggle()\n}\n\nfunction onRootKeydown(event: KeyboardEvent): void {\n  if (isDisabled.value)\n    return\n\n  // Навигация принадлежит группе: состав знает только она.\n  if (inGroup.value && group!.handleNavigationKeys(event))\n    return\n\n  if (event.key === 'Delete' || event.key === 'Backspace') {\n    if (!isClosable.value)\n      return\n    event.preventDefault()\n    requestRemove()\n  }\n}\n\nif (group) {\n  const unregister = group.register({\n    value: () => props.value as GrChipValue,\n    disabled: () => isDisabled.value,\n    el: () => rootEl.value,\n  })\n  onBeforeUnmount(unregister)\n}\n\nconst removeEl = ref<HTMLButtonElement | null>(null)\n\ndefineExpose({\n  focus: () => rootEl.value?.focus(),\n  blur: () => rootEl.value?.blur(),\n  /**\n   * Кнопка снятия — цель roving-фокуса у родителя. Отдаётся элементом, а не\n   * методом `focusRemove`: кольцу нужен сам узел, оно само решает, когда и\n   * куда переносить фокус.\n   */\n  removeEl,\n})\n</script>\n\n<template>\n  <component\n    :is=\"isInteractive ? 'button' : 'span'\"\n    ref=\"rootEl\"\n    data-gr-chip\n    :type=\"isInteractive ? 'button' : undefined\"\n    :class=\"rootClass\"\n    :role=\"chipRole\"\n    :data-value=\"value\"\n    :aria-label=\"ariaLabel\"\n    :aria-checked=\"chipRole === 'radio' ? (isSelected ? 'true' : 'false') : undefined\"\n    :aria-selected=\"chipRole === 'option' ? (isSelected ? 'true' : 'false') : undefined\"\n    :aria-pressed=\"isInteractive && !chipRole ? (isSelected ? 'true' : 'false') : undefined\"\n    :aria-disabled=\"isDisabled ? 'true' : undefined\"\n    :disabled=\"isInteractive && isDisabled ? true : undefined\"\n    :aria-keyshortcuts=\"isInteractive && isClosable ? 'Delete' : undefined\"\n    :tabindex=\"tabindex\"\n    @click=\"isInteractive ? onRootClick($event) : undefined\"\n    @keydown=\"isInteractive ? onRootKeydown($event) : undefined\"\n  >\n    <span v-if=\"$slots.icon\" data-gr-chip-icon :class=\"[chipIconClass, iconSizeClass]\">\n      <slot name=\"icon\" />\n    </span>\n\n    <span data-gr-chip-label :class=\"chipLabelClass\">\n      <slot>{{ label }}</slot>\n    </span>\n\n    <!--\n      Крестик существует в двух видах, и различитель — роль самого чипа.\n      Виджет: `<span aria-hidden>` вне таб-порядка, снятие идёт `Delete`/`Backspace`.\n      Не виджет: настоящая кнопка со своей остановкой `Tab` и своим именем.\n    -->\n    <span\n      v-if=\"isClosable && isInteractive\"\n      data-gr-chip-close\n      :class=\"[chipCloseClass, iconSizeClass]\"\n      :title=\"removeTitle\"\n      aria-hidden=\"true\"\n    >\n      <IconClose class=\"h-full w-full\" />\n    </span>\n\n    <button\n      v-else-if=\"isClosable\"\n      ref=\"removeEl\"\n      data-gr-chip-close\n      type=\"button\"\n      :class=\"[chipCloseButtonClass, iconSizeClass]\"\n      :aria-label=\"removeTitle\"\n      :tabindex=\"removeTabindex\"\n      @mousedown.prevent.stop\n      @click.stop=\"requestRemove()\"\n    >\n      <IconClose class=\"h-full w-full\" />\n    </button>\n  </component>\n</template>\n","<script setup lang=\"ts\">\nimport { computed, inject, onBeforeUnmount, ref, useAttrs } from 'vue'\n\nimport IconClose from '~icons/lucide/x'\n\nimport { useGranularityTranslations } from '../../internal/granularityI18n'\nimport { useGrComponentProp, useGrComponentSize } from '../GrConfigProvider/context'\n\nimport type { GrChipValue } from './grChipGroupContext'\n\nimport { warnRenamedProp } from '../shared/renamedProp'\nimport { GR_CHIP_GROUP_CONTEXT } from './grChipGroupContext'\nimport type { GrChipRadius, GrChipSize, GrChipTone } from './grChipStyles'\nimport {\n  chipCloseButtonClass,\n  chipCloseClass,\n  chipIconClass,\n  chipIconSizeClassBySize,\n  chipLabelClass,\n  grChipClass,\n} from './grChipStyles'\n\n/**\n * Интерактивный тег: снимаемый, выбираемый, с иконкой.\n *\n * От `GrBadge` отличается не видом, а природой: бейдж — метка, чип — виджет.\n * Поэтому цвета и радиусы взяты у бейджа как есть (в одном ряду они обязаны\n * совпадать), а роль, клавиатура и размеры — свои.\n */\nexport interface GrChipProps {\n  /** Значение чипа в группе. Вне `GrChipGroup` не используется. */\n  value?: GrChipValue\n  /**\n   * Подпись. Нужна отдельно от слота: из неё собирается имя кнопки снятия —\n   * «Убрать» на двадцати кнопках подряд не даёт выбрать нужную.\n   */\n  label?: string\n  tone?: GrChipTone\n  dark?: boolean\n  size?: GrChipSize\n  radius?: GrChipRadius\n  /** Чип становится переключателем: `aria-pressed`, `Enter`/`Space`. */\n  selectable?: boolean\n  /** Состояние переключателя вне группы. Внутри группы значение ведёт группа. */\n  selected?: boolean\n  /** Крестик. Внутри виджета он не кнопка — см. блок про роли ниже. */\n  closable?: boolean\n  disabled?: boolean\n  /** Доступное имя, когда подпись не объясняет назначения. */\n  ariaLabel?: string\n  /** Имя кнопки снятия целиком. Перебивает собранное из `label`. */\n  removeLabel?: string\n  /**\n   * `tabindex` кнопки снятия — для чипа внутри поля ввода.\n   *\n   * Там таб-стоп принадлежит `<input>`, а ряд чипов ходит стрелками: у\n   * `GrInputTag` кольцо оставляет ровно один `0`, у `GrAutocomplete` их нет\n   * вовсе. Проп нужен потому, что кольцом управляет родитель — он знает и\n   * порядок чипов, и что стоит за краем ряда.\n   */\n  removeTabindex?: number\n}\n\nexport interface GrChipEmits {\n  (e: 'update:selected', value: boolean): void\n  (e: 'remove'): void\n}\n\nconst props = withDefaults(defineProps<GrChipProps>(), {\n  value: undefined,\n  label: undefined,\n  // Дефолты живут в резолверах ниже: Vue подставил бы свой раньше, чем\n  // компонент заглянет в `GrConfigProvider`.\n  tone: undefined,\n  dark: undefined,\n  size: undefined,\n  radius: undefined,\n  selectable: false,\n  selected: false,\n  closable: false,\n  disabled: false,\n  ariaLabel: undefined,\n  removeLabel: undefined,\n  removeTabindex: undefined,\n})\n\nconst emit = defineEmits<GrChipEmits>()\n\n// `variant` переименован в `tone`: незнакомый атрибут Vue сажает на корневой\n// узел, поэтому старое имя не роняет ни типы, ни рантайм — компонент молча\n// рисуется дефолтным тоном.\nwarnRenamedProp('GrChip', useAttrs(), { variant: 'tone' })\n\ndefineSlots<{\n  /** Подпись чипа. Внутри выбираемого чипа — только фразовое содержимое. */\n  default?: () => unknown\n  /** Иконка перед подписью. */\n  icon?: () => unknown\n}>()\n\nconst { t } = useGranularityTranslations()\n\nconst group = inject(GR_CHIP_GROUP_CONTEXT, null)\nconst rootEl = ref<HTMLElement | null>(null)\n\nconst inGroup = computed(() => group !== null && props.value !== undefined)\n\nconst isDisabled = computed(() => props.disabled || (group?.disabled.value ?? false))\nconst isReadonly = computed(() => group?.readonly.value ?? false)\n\n/**\n * Чип — виджет ровно тогда, когда по нему кликают.\n *\n * От этого зависит вся разметка: у виджета роль, `tabindex` и клавиатура, а\n * крестик внутри него перестаёт быть кнопкой.\n */\nconst isInteractive = computed(() => inGroup.value || props.selectable)\n\nconst isSelected = computed(() => {\n  if (inGroup.value && props.value !== undefined)\n    return group!.isSelected(props.value)\n  return props.selected\n})\n\nconst isClosable = computed(() => {\n  if (isReadonly.value || isDisabled.value)\n    return false\n  return props.closable || (inGroup.value ? group!.closable.value : false)\n})\n\n// Приоритет: локальный проп → значение группы → `GrConfigProvider` → дефолт.\n// Группа специфичнее конфига, поэтому её значение подаётся как «локальное».\nconst resolvedSize = useGrComponentSize<GrChipSize>(\n  () => props.size ?? (inGroup.value ? group!.size.value : undefined),\n  { component: 'GrChip' },\n)\nconst resolvedTone = useGrComponentProp(\n  'GrChip',\n  'tone',\n  () => props.tone ?? (inGroup.value ? group!.tone.value : undefined),\n  'neutral',\n)\nconst resolvedRadius = useGrComponentProp(\n  'GrChip',\n  'radius',\n  () => props.radius ?? (inGroup.value ? group!.radius.value : undefined),\n  'round',\n)\nconst resolvedDark = useGrComponentProp(\n  'GrChip',\n  'dark',\n  () => props.dark ?? (inGroup.value ? group!.dark.value : undefined),\n  false,\n)\n\nconst rootClass = computed(() => grChipClass({\n  tone: resolvedTone.value,\n  dark: resolvedDark.value,\n  size: resolvedSize.value,\n  radius: resolvedRadius.value,\n  interactive: isInteractive.value && !isReadonly.value,\n  selected: isSelected.value,\n  disabled: isDisabled.value,\n}))\n\nconst iconSizeClass = computed(() => chipIconSizeClassBySize[resolvedSize.value])\n\nconst removeTitle = computed(() => {\n  if (props.removeLabel)\n    return props.removeLabel\n  if (props.label)\n    return t('gr.chip.removeNamed', 'Remove {label}', { label: props.label })\n  return t('gr.chip.remove', 'Remove')\n})\n\n/**\n * Роль чипа задаёт группа, а не потребитель.\n *\n * Одиночный переключатель — кнопка с `aria-pressed`; в группе роль зависит от\n * множественности выбора: `radio` в одиночной (образец — `GrSegmented`),\n * `option` во множественной, где контейнер объявлен `listbox` c\n * `aria-multiselectable`.\n */\nconst chipRole = computed(() => {\n  if (!inGroup.value)\n    return undefined\n  return group!.selection.value === 'single' ? 'radio' : 'option'\n})\n\nconst tabindex = computed(() => {\n  if (!isInteractive.value)\n    return undefined\n  if (isDisabled.value)\n    return -1\n  if (!inGroup.value || props.value === undefined)\n    return 0\n  return group!.rovingValue.value === props.value ? 0 : -1\n})\n\nfunction toggle(): void {\n  if (isDisabled.value || isReadonly.value)\n    return\n\n  if (inGroup.value && props.value !== undefined) {\n    group!.toggle(props.value)\n    return\n  }\n\n  if (props.selectable)\n    emit('update:selected', !props.selected)\n}\n\nfunction requestRemove(): void {\n  if (!isClosable.value)\n    return\n\n  emit('remove')\n  if (inGroup.value && props.value !== undefined)\n    group!.requestRemove(props.value)\n}\n\n/**\n * Крестик внутри виджета — не кнопка, поэтому его клик приходит сюда же и\n * разбирается по цели. Тот же приём у `GrTabs`: внутрь роли-виджета вложенная\n * кнопка запрещена (axe: `nested-interactive`), а `<button>` внутри `<button>`\n * невалиден и по контент-модели HTML.\n */\nfunction onRootClick(event: MouseEvent): void {\n  if (isDisabled.value)\n    return\n\n  if (event.target instanceof Element && event.target.closest('[data-gr-chip-close]')) {\n    requestRemove()\n    return\n  }\n\n  toggle()\n}\n\nfunction onRootKeydown(event: KeyboardEvent): void {\n  if (isDisabled.value)\n    return\n\n  // Навигация принадлежит группе: состав знает только она.\n  if (inGroup.value && group!.handleNavigationKeys(event))\n    return\n\n  if (event.key === 'Delete' || event.key === 'Backspace') {\n    if (!isClosable.value)\n      return\n    event.preventDefault()\n    requestRemove()\n  }\n}\n\nif (group) {\n  const unregister = group.register({\n    value: () => props.value as GrChipValue,\n    disabled: () => isDisabled.value,\n    el: () => rootEl.value,\n  })\n  onBeforeUnmount(unregister)\n}\n\nconst removeEl = ref<HTMLButtonElement | null>(null)\n\ndefineExpose({\n  focus: () => rootEl.value?.focus(),\n  blur: () => rootEl.value?.blur(),\n  /**\n   * Кнопка снятия — цель roving-фокуса у родителя. Отдаётся элементом, а не\n   * методом `focusRemove`: кольцу нужен сам узел, оно само решает, когда и\n   * куда переносить фокус.\n   */\n  removeEl,\n})\n</script>\n\n<template>\n  <component\n    :is=\"isInteractive ? 'button' : 'span'\"\n    ref=\"rootEl\"\n    data-gr-chip\n    :type=\"isInteractive ? 'button' : undefined\"\n    :class=\"rootClass\"\n    :role=\"chipRole\"\n    :data-value=\"value\"\n    :aria-label=\"ariaLabel\"\n    :aria-checked=\"chipRole === 'radio' ? (isSelected ? 'true' : 'false') : undefined\"\n    :aria-selected=\"chipRole === 'option' ? (isSelected ? 'true' : 'false') : undefined\"\n    :aria-pressed=\"isInteractive && !chipRole ? (isSelected ? 'true' : 'false') : undefined\"\n    :aria-disabled=\"isDisabled ? 'true' : undefined\"\n    :disabled=\"isInteractive && isDisabled ? true : undefined\"\n    :aria-keyshortcuts=\"isInteractive && isClosable ? 'Delete' : undefined\"\n    :tabindex=\"tabindex\"\n    @click=\"isInteractive ? onRootClick($event) : undefined\"\n    @keydown=\"isInteractive ? onRootKeydown($event) : undefined\"\n  >\n    <span v-if=\"$slots.icon\" data-gr-chip-icon :class=\"[chipIconClass, iconSizeClass]\">\n      <slot name=\"icon\" />\n    </span>\n\n    <span data-gr-chip-label :class=\"chipLabelClass\">\n      <slot>{{ label }}</slot>\n    </span>\n\n    <!--\n      Крестик существует в двух видах, и различитель — роль самого чипа.\n      Виджет: `<span aria-hidden>` вне таб-порядка, снятие идёт `Delete`/`Backspace`.\n      Не виджет: настоящая кнопка со своей остановкой `Tab` и своим именем.\n    -->\n    <span\n      v-if=\"isClosable && isInteractive\"\n      data-gr-chip-close\n      :class=\"[chipCloseClass, iconSizeClass]\"\n      :title=\"removeTitle\"\n      aria-hidden=\"true\"\n    >\n      <IconClose class=\"h-full w-full\" />\n    </span>\n\n    <button\n      v-else-if=\"isClosable\"\n      ref=\"removeEl\"\n      data-gr-chip-close\n      type=\"button\"\n      :class=\"[chipCloseButtonClass, iconSizeClass]\"\n      :aria-label=\"removeTitle\"\n      :tabindex=\"removeTabindex\"\n      @mousedown.prevent.stop\n      @click.stop=\"requestRemove()\"\n    >\n      <IconClose class=\"h-full w-full\" />\n    </button>\n  </component>\n</template>\n"],"mappings":"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"}
+{"version":3,"file":"GrChip-DoyS1Dr4.js","names":["$slots"],"sources":["../../../../src/components/GrChip/GrChip.vue","../../../../src/components/GrChip/GrChip.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, inject, onBeforeUnmount, ref, useAttrs } from 'vue'\n\nimport IconClose from '~icons/lucide/x'\n\nimport { useGranularityTranslations } from '../../internal/granularityI18n'\nimport { useGrComponentProp, useGrComponentSize } from '../GrConfigProvider/context'\n\nimport type { GrChipValue } from './grChipGroupContext'\n\nimport { warnRenamedProp } from '../shared/renamedProp'\nimport { GR_CHIP_GROUP_CONTEXT } from './grChipGroupContext'\nimport type { GrChipRadius, GrChipSize, GrChipTone } from './grChipStyles'\nimport {\n  chipCloseButtonClass,\n  chipCloseClass,\n  chipIconClass,\n  chipIconSizeClassBySize,\n  chipLabelClass,\n  grChipClass,\n} from './grChipStyles'\n\n/**\n * Интерактивный тег: снимаемый, выбираемый, с иконкой.\n *\n * От `GrBadge` отличается не видом, а природой: бейдж — метка, чип — виджет.\n * Поэтому цвета и радиусы взяты у бейджа как есть (в одном ряду они обязаны\n * совпадать), а роль, клавиатура и размеры — свои.\n */\nexport interface GrChipProps {\n  /** Значение чипа в группе. Вне `GrChipGroup` не используется. */\n  value?: GrChipValue\n  /**\n   * Подпись. Нужна отдельно от слота: из неё собирается имя кнопки снятия —\n   * «Убрать» на двадцати кнопках подряд не даёт выбрать нужную.\n   */\n  label?: string\n  tone?: GrChipTone\n  dark?: boolean\n  size?: GrChipSize\n  radius?: GrChipRadius\n  /** Чип становится переключателем: `aria-pressed`, `Enter`/`Space`. */\n  selectable?: boolean\n  /** Состояние переключателя вне группы. Внутри группы значение ведёт группа. */\n  selected?: boolean\n  /** Крестик. Внутри виджета он не кнопка — см. блок про роли ниже. */\n  closable?: boolean\n  disabled?: boolean\n  /** Доступное имя, когда подпись не объясняет назначения. */\n  ariaLabel?: string\n  /** Имя кнопки снятия целиком. Перебивает собранное из `label`. */\n  removeLabel?: string\n  /**\n   * `tabindex` кнопки снятия — для чипа внутри поля ввода.\n   *\n   * Там таб-стоп принадлежит `<input>`, а ряд чипов ходит стрелками: у\n   * `GrInputTag` кольцо оставляет ровно один `0`, у `GrAutocomplete` их нет\n   * вовсе. Проп нужен потому, что кольцом управляет родитель — он знает и\n   * порядок чипов, и что стоит за краем ряда.\n   */\n  removeTabindex?: number\n}\n\nexport interface GrChipEmits {\n  (e: 'update:selected', value: boolean): void\n  (e: 'remove'): void\n}\n\nconst props = withDefaults(defineProps<GrChipProps>(), {\n  value: undefined,\n  label: undefined,\n  // Дефолты живут в резолверах ниже: Vue подставил бы свой раньше, чем\n  // компонент заглянет в `GrConfigProvider`.\n  tone: undefined,\n  dark: undefined,\n  size: undefined,\n  radius: undefined,\n  selectable: false,\n  selected: false,\n  closable: false,\n  disabled: false,\n  ariaLabel: undefined,\n  removeLabel: undefined,\n  removeTabindex: undefined,\n})\n\nconst emit = defineEmits<GrChipEmits>()\n\n// `variant` переименован в `tone`: незнакомый атрибут Vue сажает на корневой\n// узел, поэтому старое имя не роняет ни типы, ни рантайм — компонент молча\n// рисуется дефолтным тоном.\nwarnRenamedProp('GrChip', useAttrs(), { variant: 'tone' })\n\ndefineSlots<{\n  /** Подпись чипа. Внутри выбираемого чипа — только фразовое содержимое. */\n  default?: () => unknown\n  /** Иконка перед подписью. */\n  icon?: () => unknown\n}>()\n\nconst { t } = useGranularityTranslations()\n\nconst group = inject(GR_CHIP_GROUP_CONTEXT, null)\nconst rootEl = ref<HTMLElement | null>(null)\n\nconst inGroup = computed(() => group !== null && props.value !== undefined)\n\nconst isDisabled = computed(() => props.disabled || (group?.disabled.value ?? false))\nconst isReadonly = computed(() => group?.readonly.value ?? false)\n\n/**\n * Чип — виджет ровно тогда, когда по нему кликают.\n *\n * От этого зависит вся разметка: у виджета роль, `tabindex` и клавиатура, а\n * крестик внутри него перестаёт быть кнопкой.\n */\nconst isInteractive = computed(() => inGroup.value || props.selectable)\n\nconst isSelected = computed(() => {\n  if (inGroup.value && props.value !== undefined)\n    return group!.isSelected(props.value)\n  return props.selected\n})\n\nconst isClosable = computed(() => {\n  if (isReadonly.value || isDisabled.value)\n    return false\n  return props.closable || (inGroup.value ? group!.closable.value : false)\n})\n\n// Приоритет: локальный проп → значение группы → `GrConfigProvider` → дефолт.\n// Группа специфичнее конфига, поэтому её значение подаётся как «локальное».\nconst resolvedSize = useGrComponentSize<GrChipSize>(\n  () => props.size ?? (inGroup.value ? group!.size.value : undefined),\n  { component: 'GrChip' },\n)\nconst resolvedTone = useGrComponentProp(\n  'GrChip',\n  'tone',\n  () => props.tone ?? (inGroup.value ? group!.tone.value : undefined),\n  'neutral',\n)\nconst resolvedRadius = useGrComponentProp(\n  'GrChip',\n  'radius',\n  () => props.radius ?? (inGroup.value ? group!.radius.value : undefined),\n  'round',\n)\nconst resolvedDark = useGrComponentProp(\n  'GrChip',\n  'dark',\n  () => props.dark ?? (inGroup.value ? group!.dark.value : undefined),\n  false,\n)\n\nconst rootClass = computed(() => grChipClass({\n  tone: resolvedTone.value,\n  dark: resolvedDark.value,\n  size: resolvedSize.value,\n  radius: resolvedRadius.value,\n  interactive: isInteractive.value && !isReadonly.value,\n  selected: isSelected.value,\n  disabled: isDisabled.value,\n}))\n\nconst iconSizeClass = computed(() => chipIconSizeClassBySize[resolvedSize.value])\n\nconst removeTitle = computed(() => {\n  if (props.removeLabel)\n    return props.removeLabel\n  if (props.label)\n    return t('gr.chip.removeNamed', 'Remove {label}', { label: props.label })\n  return t('gr.chip.remove', 'Remove')\n})\n\n/**\n * Роль чипа задаёт группа, а не потребитель.\n *\n * Одиночный переключатель — кнопка с `aria-pressed`; в группе роль зависит от\n * множественности выбора: `radio` в одиночной (образец — `GrSegmented`),\n * `option` во множественной, где контейнер объявлен `listbox` c\n * `aria-multiselectable`.\n */\nconst chipRole = computed(() => {\n  if (!inGroup.value)\n    return undefined\n  return group!.selection.value === 'single' ? 'radio' : 'option'\n})\n\nconst tabindex = computed(() => {\n  if (!isInteractive.value)\n    return undefined\n  if (isDisabled.value)\n    return -1\n  if (!inGroup.value || props.value === undefined)\n    return 0\n  return group!.rovingValue.value === props.value ? 0 : -1\n})\n\nfunction toggle(): void {\n  if (isDisabled.value || isReadonly.value)\n    return\n\n  if (inGroup.value && props.value !== undefined) {\n    group!.toggle(props.value)\n    return\n  }\n\n  if (props.selectable)\n    emit('update:selected', !props.selected)\n}\n\nfunction requestRemove(): void {\n  if (!isClosable.value)\n    return\n\n  emit('remove')\n  if (inGroup.value && props.value !== undefined)\n    group!.requestRemove(props.value)\n}\n\n/**\n * Крестик внутри виджета — не кнопка, поэтому его клик приходит сюда же и\n * разбирается по цели. Тот же приём у `GrTabs`: внутрь роли-виджета вложенная\n * кнопка запрещена (axe: `nested-interactive`), а `<button>` внутри `<button>`\n * невалиден и по контент-модели HTML.\n */\nfunction onRootClick(event: MouseEvent): void {\n  if (isDisabled.value)\n    return\n\n  if (event.target instanceof Element && event.target.closest('[data-gr-chip-close]')) {\n    requestRemove()\n    return\n  }\n\n  toggle()\n}\n\nfunction onRootKeydown(event: KeyboardEvent): void {\n  if (isDisabled.value)\n    return\n\n  // Навигация принадлежит группе: состав знает только она.\n  if (inGroup.value && group!.handleNavigationKeys(event))\n    return\n\n  if (event.key === 'Delete' || event.key === 'Backspace') {\n    if (!isClosable.value)\n      return\n    event.preventDefault()\n    requestRemove()\n  }\n}\n\nif (group) {\n  const unregister = group.register({\n    value: () => props.value as GrChipValue,\n    disabled: () => isDisabled.value,\n    el: () => rootEl.value,\n  })\n  onBeforeUnmount(unregister)\n}\n\nconst removeEl = ref<HTMLButtonElement | null>(null)\n\ndefineExpose({\n  focus: () => rootEl.value?.focus(),\n  blur: () => rootEl.value?.blur(),\n  /**\n   * Кнопка снятия — цель roving-фокуса у родителя. Отдаётся элементом, а не\n   * методом `focusRemove`: кольцу нужен сам узел, оно само решает, когда и\n   * куда переносить фокус.\n   */\n  removeEl,\n})\n</script>\n\n<template>\n  <component\n    :is=\"isInteractive ? 'button' : 'span'\"\n    ref=\"rootEl\"\n    data-gr-chip\n    :type=\"isInteractive ? 'button' : undefined\"\n    :class=\"rootClass\"\n    :role=\"chipRole\"\n    :data-value=\"value\"\n    :aria-label=\"ariaLabel\"\n    :aria-checked=\"chipRole === 'radio' ? (isSelected ? 'true' : 'false') : undefined\"\n    :aria-selected=\"chipRole === 'option' ? (isSelected ? 'true' : 'false') : undefined\"\n    :aria-pressed=\"isInteractive && !chipRole ? (isSelected ? 'true' : 'false') : undefined\"\n    :aria-disabled=\"isDisabled ? 'true' : undefined\"\n    :disabled=\"isInteractive && isDisabled ? true : undefined\"\n    :aria-keyshortcuts=\"isInteractive && isClosable ? 'Delete' : undefined\"\n    :tabindex=\"tabindex\"\n    @click=\"isInteractive ? onRootClick($event) : undefined\"\n    @keydown=\"isInteractive ? onRootKeydown($event) : undefined\"\n  >\n    <span v-if=\"$slots.icon\" data-gr-chip-icon :class=\"[chipIconClass, iconSizeClass]\">\n      <slot name=\"icon\" />\n    </span>\n\n    <span data-gr-chip-label :class=\"chipLabelClass\">\n      <slot>{{ label }}</slot>\n    </span>\n\n    <!--\n      Крестик существует в двух видах, и различитель — роль самого чипа.\n      Виджет: `<span aria-hidden>` вне таб-порядка, снятие идёт `Delete`/`Backspace`.\n      Не виджет: настоящая кнопка со своей остановкой `Tab` и своим именем.\n    -->\n    <span\n      v-if=\"isClosable && isInteractive\"\n      data-gr-chip-close\n      :class=\"[chipCloseClass, iconSizeClass]\"\n      :title=\"removeTitle\"\n      aria-hidden=\"true\"\n    >\n      <IconClose class=\"h-full w-full\" />\n    </span>\n\n    <button\n      v-else-if=\"isClosable\"\n      ref=\"removeEl\"\n      data-gr-chip-close\n      type=\"button\"\n      :class=\"[chipCloseButtonClass, iconSizeClass]\"\n      :aria-label=\"removeTitle\"\n      :tabindex=\"removeTabindex\"\n      @mousedown.prevent.stop\n      @click.stop=\"requestRemove()\"\n    >\n      <IconClose class=\"h-full w-full\" />\n    </button>\n  </component>\n</template>\n","<script setup lang=\"ts\">\nimport { computed, inject, onBeforeUnmount, ref, useAttrs } from 'vue'\n\nimport IconClose from '~icons/lucide/x'\n\nimport { useGranularityTranslations } from '../../internal/granularityI18n'\nimport { useGrComponentProp, useGrComponentSize } from '../GrConfigProvider/context'\n\nimport type { GrChipValue } from './grChipGroupContext'\n\nimport { warnRenamedProp } from '../shared/renamedProp'\nimport { GR_CHIP_GROUP_CONTEXT } from './grChipGroupContext'\nimport type { GrChipRadius, GrChipSize, GrChipTone } from './grChipStyles'\nimport {\n  chipCloseButtonClass,\n  chipCloseClass,\n  chipIconClass,\n  chipIconSizeClassBySize,\n  chipLabelClass,\n  grChipClass,\n} from './grChipStyles'\n\n/**\n * Интерактивный тег: снимаемый, выбираемый, с иконкой.\n *\n * От `GrBadge` отличается не видом, а природой: бейдж — метка, чип — виджет.\n * Поэтому цвета и радиусы взяты у бейджа как есть (в одном ряду они обязаны\n * совпадать), а роль, клавиатура и размеры — свои.\n */\nexport interface GrChipProps {\n  /** Значение чипа в группе. Вне `GrChipGroup` не используется. */\n  value?: GrChipValue\n  /**\n   * Подпись. Нужна отдельно от слота: из неё собирается имя кнопки снятия —\n   * «Убрать» на двадцати кнопках подряд не даёт выбрать нужную.\n   */\n  label?: string\n  tone?: GrChipTone\n  dark?: boolean\n  size?: GrChipSize\n  radius?: GrChipRadius\n  /** Чип становится переключателем: `aria-pressed`, `Enter`/`Space`. */\n  selectable?: boolean\n  /** Состояние переключателя вне группы. Внутри группы значение ведёт группа. */\n  selected?: boolean\n  /** Крестик. Внутри виджета он не кнопка — см. блок про роли ниже. */\n  closable?: boolean\n  disabled?: boolean\n  /** Доступное имя, когда подпись не объясняет назначения. */\n  ariaLabel?: string\n  /** Имя кнопки снятия целиком. Перебивает собранное из `label`. */\n  removeLabel?: string\n  /**\n   * `tabindex` кнопки снятия — для чипа внутри поля ввода.\n   *\n   * Там таб-стоп принадлежит `<input>`, а ряд чипов ходит стрелками: у\n   * `GrInputTag` кольцо оставляет ровно один `0`, у `GrAutocomplete` их нет\n   * вовсе. Проп нужен потому, что кольцом управляет родитель — он знает и\n   * порядок чипов, и что стоит за краем ряда.\n   */\n  removeTabindex?: number\n}\n\nexport interface GrChipEmits {\n  (e: 'update:selected', value: boolean): void\n  (e: 'remove'): void\n}\n\nconst props = withDefaults(defineProps<GrChipProps>(), {\n  value: undefined,\n  label: undefined,\n  // Дефолты живут в резолверах ниже: Vue подставил бы свой раньше, чем\n  // компонент заглянет в `GrConfigProvider`.\n  tone: undefined,\n  dark: undefined,\n  size: undefined,\n  radius: undefined,\n  selectable: false,\n  selected: false,\n  closable: false,\n  disabled: false,\n  ariaLabel: undefined,\n  removeLabel: undefined,\n  removeTabindex: undefined,\n})\n\nconst emit = defineEmits<GrChipEmits>()\n\n// `variant` переименован в `tone`: незнакомый атрибут Vue сажает на корневой\n// узел, поэтому старое имя не роняет ни типы, ни рантайм — компонент молча\n// рисуется дефолтным тоном.\nwarnRenamedProp('GrChip', useAttrs(), { variant: 'tone' })\n\ndefineSlots<{\n  /** Подпись чипа. Внутри выбираемого чипа — только фразовое содержимое. */\n  default?: () => unknown\n  /** Иконка перед подписью. */\n  icon?: () => unknown\n}>()\n\nconst { t } = useGranularityTranslations()\n\nconst group = inject(GR_CHIP_GROUP_CONTEXT, null)\nconst rootEl = ref<HTMLElement | null>(null)\n\nconst inGroup = computed(() => group !== null && props.value !== undefined)\n\nconst isDisabled = computed(() => props.disabled || (group?.disabled.value ?? false))\nconst isReadonly = computed(() => group?.readonly.value ?? false)\n\n/**\n * Чип — виджет ровно тогда, когда по нему кликают.\n *\n * От этого зависит вся разметка: у виджета роль, `tabindex` и клавиатура, а\n * крестик внутри него перестаёт быть кнопкой.\n */\nconst isInteractive = computed(() => inGroup.value || props.selectable)\n\nconst isSelected = computed(() => {\n  if (inGroup.value && props.value !== undefined)\n    return group!.isSelected(props.value)\n  return props.selected\n})\n\nconst isClosable = computed(() => {\n  if (isReadonly.value || isDisabled.value)\n    return false\n  return props.closable || (inGroup.value ? group!.closable.value : false)\n})\n\n// Приоритет: локальный проп → значение группы → `GrConfigProvider` → дефолт.\n// Группа специфичнее конфига, поэтому её значение подаётся как «локальное».\nconst resolvedSize = useGrComponentSize<GrChipSize>(\n  () => props.size ?? (inGroup.value ? group!.size.value : undefined),\n  { component: 'GrChip' },\n)\nconst resolvedTone = useGrComponentProp(\n  'GrChip',\n  'tone',\n  () => props.tone ?? (inGroup.value ? group!.tone.value : undefined),\n  'neutral',\n)\nconst resolvedRadius = useGrComponentProp(\n  'GrChip',\n  'radius',\n  () => props.radius ?? (inGroup.value ? group!.radius.value : undefined),\n  'round',\n)\nconst resolvedDark = useGrComponentProp(\n  'GrChip',\n  'dark',\n  () => props.dark ?? (inGroup.value ? group!.dark.value : undefined),\n  false,\n)\n\nconst rootClass = computed(() => grChipClass({\n  tone: resolvedTone.value,\n  dark: resolvedDark.value,\n  size: resolvedSize.value,\n  radius: resolvedRadius.value,\n  interactive: isInteractive.value && !isReadonly.value,\n  selected: isSelected.value,\n  disabled: isDisabled.value,\n}))\n\nconst iconSizeClass = computed(() => chipIconSizeClassBySize[resolvedSize.value])\n\nconst removeTitle = computed(() => {\n  if (props.removeLabel)\n    return props.removeLabel\n  if (props.label)\n    return t('gr.chip.removeNamed', 'Remove {label}', { label: props.label })\n  return t('gr.chip.remove', 'Remove')\n})\n\n/**\n * Роль чипа задаёт группа, а не потребитель.\n *\n * Одиночный переключатель — кнопка с `aria-pressed`; в группе роль зависит от\n * множественности выбора: `radio` в одиночной (образец — `GrSegmented`),\n * `option` во множественной, где контейнер объявлен `listbox` c\n * `aria-multiselectable`.\n */\nconst chipRole = computed(() => {\n  if (!inGroup.value)\n    return undefined\n  return group!.selection.value === 'single' ? 'radio' : 'option'\n})\n\nconst tabindex = computed(() => {\n  if (!isInteractive.value)\n    return undefined\n  if (isDisabled.value)\n    return -1\n  if (!inGroup.value || props.value === undefined)\n    return 0\n  return group!.rovingValue.value === props.value ? 0 : -1\n})\n\nfunction toggle(): void {\n  if (isDisabled.value || isReadonly.value)\n    return\n\n  if (inGroup.value && props.value !== undefined) {\n    group!.toggle(props.value)\n    return\n  }\n\n  if (props.selectable)\n    emit('update:selected', !props.selected)\n}\n\nfunction requestRemove(): void {\n  if (!isClosable.value)\n    return\n\n  emit('remove')\n  if (inGroup.value && props.value !== undefined)\n    group!.requestRemove(props.value)\n}\n\n/**\n * Крестик внутри виджета — не кнопка, поэтому его клик приходит сюда же и\n * разбирается по цели. Тот же приём у `GrTabs`: внутрь роли-виджета вложенная\n * кнопка запрещена (axe: `nested-interactive`), а `<button>` внутри `<button>`\n * невалиден и по контент-модели HTML.\n */\nfunction onRootClick(event: MouseEvent): void {\n  if (isDisabled.value)\n    return\n\n  if (event.target instanceof Element && event.target.closest('[data-gr-chip-close]')) {\n    requestRemove()\n    return\n  }\n\n  toggle()\n}\n\nfunction onRootKeydown(event: KeyboardEvent): void {\n  if (isDisabled.value)\n    return\n\n  // Навигация принадлежит группе: состав знает только она.\n  if (inGroup.value && group!.handleNavigationKeys(event))\n    return\n\n  if (event.key === 'Delete' || event.key === 'Backspace') {\n    if (!isClosable.value)\n      return\n    event.preventDefault()\n    requestRemove()\n  }\n}\n\nif (group) {\n  const unregister = group.register({\n    value: () => props.value as GrChipValue,\n    disabled: () => isDisabled.value,\n    el: () => rootEl.value,\n  })\n  onBeforeUnmount(unregister)\n}\n\nconst removeEl = ref<HTMLButtonElement | null>(null)\n\ndefineExpose({\n  focus: () => rootEl.value?.focus(),\n  blur: () => rootEl.value?.blur(),\n  /**\n   * Кнопка снятия — цель roving-фокуса у родителя. Отдаётся элементом, а не\n   * методом `focusRemove`: кольцу нужен сам узел, оно само решает, когда и\n   * куда переносить фокус.\n   */\n  removeEl,\n})\n</script>\n\n<template>\n  <component\n    :is=\"isInteractive ? 'button' : 'span'\"\n    ref=\"rootEl\"\n    data-gr-chip\n    :type=\"isInteractive ? 'button' : undefined\"\n    :class=\"rootClass\"\n    :role=\"chipRole\"\n    :data-value=\"value\"\n    :aria-label=\"ariaLabel\"\n    :aria-checked=\"chipRole === 'radio' ? (isSelected ? 'true' : 'false') : undefined\"\n    :aria-selected=\"chipRole === 'option' ? (isSelected ? 'true' : 'false') : undefined\"\n    :aria-pressed=\"isInteractive && !chipRole ? (isSelected ? 'true' : 'false') : undefined\"\n    :aria-disabled=\"isDisabled ? 'true' : undefined\"\n    :disabled=\"isInteractive && isDisabled ? true : undefined\"\n    :aria-keyshortcuts=\"isInteractive && isClosable ? 'Delete' : undefined\"\n    :tabindex=\"tabindex\"\n    @click=\"isInteractive ? onRootClick($event) : undefined\"\n    @keydown=\"isInteractive ? onRootKeydown($event) : undefined\"\n  >\n    <span v-if=\"$slots.icon\" data-gr-chip-icon :class=\"[chipIconClass, iconSizeClass]\">\n      <slot name=\"icon\" />\n    </span>\n\n    <span data-gr-chip-label :class=\"chipLabelClass\">\n      <slot>{{ label }}</slot>\n    </span>\n\n    <!--\n      Крестик существует в двух видах, и различитель — роль самого чипа.\n      Виджет: `<span aria-hidden>` вне таб-порядка, снятие идёт `Delete`/`Backspace`.\n      Не виджет: настоящая кнопка со своей остановкой `Tab` и своим именем.\n    -->\n    <span\n      v-if=\"isClosable && isInteractive\"\n      data-gr-chip-close\n      :class=\"[chipCloseClass, iconSizeClass]\"\n      :title=\"removeTitle\"\n      aria-hidden=\"true\"\n    >\n      <IconClose class=\"h-full w-full\" />\n    </span>\n\n    <button\n      v-else-if=\"isClosable\"\n      ref=\"removeEl\"\n      data-gr-chip-close\n      type=\"button\"\n      :class=\"[chipCloseButtonClass, iconSizeClass]\"\n      :aria-label=\"removeTitle\"\n      :tabindex=\"removeTabindex\"\n      @mousedown.prevent.stop\n      @click.stop=\"requestRemove()\"\n    >\n      <IconClose class=\"h-full w-full\" />\n    </button>\n  </component>\n</template>\n"],"mappings":"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"}

package/dist/components/GrChip/index.js

@@ -1,3 +1,3 @@
-import { t as GrChip_default } from "./chunks/GrChip-CKqyzYcv.js";
-import { n as grChipSafelist, t as grChipConfig } from "../../chunks/config-2vrOFn2f.js";
+import { t as GrChip_default } from "./chunks/GrChip-DoyS1Dr4.js";
+import { n as grChipSafelist, t as grChipConfig } from "../../chunks/config-AKpLyIGD.js";
 export { GrChip_default as GrChip, GrChip_default as default, grChipConfig, grChipSafelist };

package/dist/components/GrInputTag/chunks/{GrInputTag-CO0YU-ok.js → GrInputTag-qnRdAZnn.js}

@@ -9,8 +9,8 @@ import { useGrFormControl } from "../../../composables/useGrFormControl.js";
 import { t as useFocusWithin } from "../../../chunks/useFocusWithin-BwHE0rzm.js";
 import { useRovingFocus } from "../../../composables/useRovingFocus.js";
 import { t as useControlAddons } from "../../../chunks/useControlAddons-asUr10Pf.js";
-import { d as chipSizeForBadgeScale } from "../../../chunks/grChipStyles-DcDyxAL0.js";
-import { t as GrChip_default } from "../../GrChip/chunks/GrChip-CKqyzYcv.js";
+import { d as chipSizeForBadgeScale } from "../../../chunks/grChipStyles-CA9Wj1_E.js";
+import { t as GrChip_default } from "../../GrChip/chunks/GrChip-DoyS1Dr4.js";
 import { useAnnouncer } from "../../../composables/useAnnouncer.js";
 import { a as controlStateTextKey, i as controlStateIconColors, n as controlStateFallbackText, r as controlStateIconClass, t as controlSignalState } from "../../../chunks/controlState-DoImKciE.js";
 import { t as loader_2_default } from "../../../chunks/loader-2-B1fdsdWW.js";