@feugene/granularity 0.4.0 → 0.4.2

package/dist/components/GrInput/chunks/GrInput-ghxaTf6d.js

@@ -0,0 +1,211 @@
+import { computed, createCommentVNode, createElementBlock, createElementVNode, defineComponent, mergeProps, nextTick, normalizeStyle, onBeforeUnmount, onMounted, onUpdated, openBlock, ref, renderSlot, useSlots } from "vue";
+//#region src/components/GrInput/GrInput.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1 = { class: "relative w-full" };
+var _hoisted_2 = [
+	"id",
+	"name",
+	"type",
+	"inputmode",
+	"autocomplete",
+	"placeholder",
+	"disabled",
+	"value",
+	"aria-invalid"
+];
+//#endregion
+//#region src/components/GrInput/GrInput.vue
+var GrInput_default = /* @__PURE__ */ defineComponent({
+	inheritAttrs: false,
+	__name: "GrInput",
+	props: {
+		modelValue: {},
+		type: { default: "text" },
+		placeholder: { default: void 0 },
+		autocomplete: { default: void 0 },
+		inputmode: { default: void 0 },
+		disabled: {
+			type: Boolean,
+			default: false
+		},
+		invalid: {
+			type: Boolean,
+			default: false
+		},
+		state: { default: "default" },
+		name: { default: void 0 },
+		id: { default: void 0 },
+		size: { default: "md" },
+		textAlign: { default: "left" },
+		prefixMinWidth: { default: void 0 },
+		prefixMaxWidth: { default: void 0 },
+		suffixMinWidth: { default: void 0 },
+		suffixMaxWidth: { default: void 0 }
+	},
+	emits: ["update:modelValue"],
+	setup(__props, { expose: __expose, emit: __emit }) {
+		const props = __props;
+		const emit = __emit;
+		const inputEl = ref(null);
+		function focus() {
+			inputEl.value?.focus();
+		}
+		__expose({ focus });
+		const slots = useSlots();
+		const hasPrefix = computed(() => Boolean(slots.prefix));
+		const hasSuffix = computed(() => Boolean(slots.suffix));
+		const defaultAddonMinWidth = computed(() => {
+			return {
+				xs: "2rem",
+				sm: "2.25rem",
+				md: "2.5rem",
+				lg: "3rem"
+			}[props.size];
+		});
+		const prefixMinWidth = computed(() => props.prefixMinWidth ?? defaultAddonMinWidth.value);
+		const suffixMinWidth = computed(() => props.suffixMinWidth ?? defaultAddonMinWidth.value);
+		const prefixEl = ref(null);
+		const suffixEl = ref(null);
+		const measuredPrefixWidth = ref(void 0);
+		const measuredSuffixWidth = ref(void 0);
+		let ro = null;
+		let scheduled = false;
+		function readWidthPx(el) {
+			if (!el) return void 0;
+			const width = Math.ceil(el.getBoundingClientRect().width || 0);
+			if (width <= 0) return void 0;
+			return `${width}px`;
+		}
+		function measure() {
+			measuredPrefixWidth.value = hasPrefix.value ? readWidthPx(prefixEl.value) : void 0;
+			measuredSuffixWidth.value = hasSuffix.value ? readWidthPx(suffixEl.value) : void 0;
+		}
+		function refreshObserver() {
+			if (typeof ResizeObserver === "undefined") return;
+			if (!ro) ro = new ResizeObserver(() => measure());
+			ro.disconnect();
+			if (prefixEl.value) ro.observe(prefixEl.value);
+			if (suffixEl.value) ro.observe(suffixEl.value);
+		}
+		function scheduleMeasure() {
+			if (scheduled) return;
+			scheduled = true;
+			nextTick(() => {
+				scheduled = false;
+				measure();
+				refreshObserver();
+			});
+		}
+		onMounted(() => scheduleMeasure());
+		onUpdated(() => scheduleMeasure());
+		onBeforeUnmount(() => ro?.disconnect());
+		function addLen(a, b) {
+			if (a === "0px") return b;
+			if (b === "0px") return a;
+			const apx = a.endsWith("px") ? Number(a.slice(0, -2)) : null;
+			const bpx = b.endsWith("px") ? Number(b.slice(0, -2)) : null;
+			if (apx !== null && Number.isFinite(apx) && bpx !== null && Number.isFinite(bpx)) return `${apx + bpx}px`;
+			return `calc(${a} + ${b})`;
+		}
+		const basePaddingXLen = computed(() => {
+			return {
+				xs: "10px",
+				sm: "12px",
+				md: "12px",
+				lg: "16px"
+			}[props.size];
+		});
+		const inputStyle = computed(() => {
+			const leftReserved = hasPrefix.value ? measuredPrefixWidth.value ?? prefixMinWidth.value : "0px";
+			const rightReserved = hasSuffix.value ? measuredSuffixWidth.value ?? suffixMinWidth.value : "0px";
+			return {
+				paddingLeft: hasPrefix.value ? addLen(leftReserved, basePaddingXLen.value) : void 0,
+				paddingRight: hasSuffix.value ? addLen(rightReserved, basePaddingXLen.value) : void 0
+			};
+		});
+		const prefixStyle = computed(() => {
+			return {
+				minWidth: prefixMinWidth.value,
+				maxWidth: props.prefixMaxWidth
+			};
+		});
+		const suffixStyle = computed(() => {
+			return {
+				minWidth: suffixMinWidth.value,
+				maxWidth: props.suffixMaxWidth
+			};
+		});
+		const sizeClass = computed(() => {
+			return {
+				xs: "h-7 px-2.5 text-[12px]",
+				sm: "h-8 px-3 text-[13px]",
+				md: "h-10 px-3 text-[14px]",
+				lg: "h-11 px-4 text-[16px]"
+			}[props.size];
+		});
+		const textAlignClass = computed(() => {
+			return {
+				left: "text-left",
+				center: "text-center",
+				right: "text-right"
+			}[props.textAlign];
+		});
+		const className = computed(() => {
+			const state = props.state;
+			const borderByState = {
+				default: "border-[var(--brd)]",
+				success: "border-[var(--ds-success)] focus-visible:ring-[var(--ds-success)]",
+				warning: "border-[var(--ds-warning)] focus-visible:ring-[var(--ds-warning)]",
+				danger: "border-[var(--ds-danger)] focus-visible:ring-[var(--ds-danger)]"
+			};
+			return [
+				sizeClass.value,
+				textAlignClass.value,
+				props.invalid ? borderByState.danger : borderByState[state]
+			].join(" ");
+		});
+		function onInput(e) {
+			emit("update:modelValue", e.target.value);
+		}
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("div", _hoisted_1, [
+				_ctx.$slots.prefix ? (openBlock(), createElementBlock("div", {
+					key: 0,
+					ref_key: "prefixEl",
+					ref: prefixEl,
+					"data-testid": "ds-input-prefix",
+					class: "absolute inset-y-0 left-0 flex items-center justify-center border-r border-[var(--brd)] px-2 text-[var(--muted-fg)] pointer-events-none select-none truncate",
+					style: normalizeStyle(prefixStyle.value),
+					"aria-hidden": "true"
+				}, [renderSlot(_ctx.$slots, "prefix")], 4)) : createCommentVNode("", true),
+				createElementVNode("input", mergeProps({
+					id: props.id,
+					ref_key: "inputEl",
+					ref: inputEl
+				}, _ctx.$attrs, {
+					name: props.name,
+					type: props.type,
+					inputmode: props.inputmode,
+					autocomplete: props.autocomplete,
+					placeholder: props.placeholder,
+					disabled: props.disabled,
+					value: props.modelValue,
+					"aria-invalid": props.invalid ? "true" : void 0,
+					class: ["w-full rounded-md border bg-[var(--bg)] text-[var(--fg)] placeholder:text-[var(--muted-fg)] focus:placeholder:text-transparent transition-colors duration-150 focus:outline-none focus-visible:ring-2 focus-visible:ring-[var(--ring)] disabled:opacity-50 disabled:cursor-not-allowed", className.value],
+					style: inputStyle.value,
+					onInput
+				}), null, 16, _hoisted_2),
+				_ctx.$slots.suffix ? (openBlock(), createElementBlock("div", {
+					key: 1,
+					ref_key: "suffixEl",
+					ref: suffixEl,
+					"data-testid": "ds-input-suffix",
+					class: "absolute inset-y-0 right-0 flex items-center justify-center border-l border-[var(--brd)] px-2 text-[var(--muted-fg)] pointer-events-none select-none truncate",
+					style: normalizeStyle(suffixStyle.value),
+					"aria-hidden": "true"
+				}, [renderSlot(_ctx.$slots, "suffix")], 4)) : createCommentVNode("", true)
+			]);
+		};
+	}
+});
+//#endregion
+export { GrInput_default as t };

package/dist/components/GrInput/chunks/GrInput-ghxaTf6d.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"GrInput-ghxaTf6d.js","names":["$slots","$attrs"],"sources":["../../../../src/components/GrInput/GrInput.vue","../../../../src/components/GrInput/GrInput.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport {computed, nextTick, onBeforeUnmount, onMounted, onUpdated, ref, useSlots} from 'vue'\nimport type {InputHTMLAttributes} from 'vue'\n\ndefineOptions({\n  inheritAttrs: false,\n})\n\nexport type GrInputSize = 'xs' | 'sm' | 'md' | 'lg'\nexport type GrInputTextAlign = 'left' | 'center' | 'right'\n\nconst props = withDefaults(\n    defineProps<{\n      modelValue: string\n      type?: 'text' | 'email' | 'password' | 'number' | 'search'\n      placeholder?: string\n      autocomplete?: string\n      inputmode?: InputHTMLAttributes['inputmode']\n      disabled?: boolean\n      invalid?: boolean\n      state?: 'default' | 'success' | 'warning' | 'danger'\n      name?: string\n      id?: string\n      size?: GrInputSize\n\n      textAlign?: GrInputTextAlign\n\n      prefixMinWidth?: string\n      prefixMaxWidth?: string\n      suffixMinWidth?: string\n      suffixMaxWidth?: string\n    }>(),\n    {\n      type: 'text',\n      placeholder: undefined,\n      autocomplete: undefined,\n      inputmode: undefined,\n      disabled: false,\n      invalid: false,\n      state: 'default',\n      name: undefined,\n      id: undefined,\n      size: 'md',\n\n      textAlign: 'left',\n\n      prefixMinWidth: undefined,\n      prefixMaxWidth: undefined,\n      suffixMinWidth: undefined,\n      suffixMaxWidth: undefined,\n    },\n)\n\nconst emit = defineEmits<{\n  (e: 'update:modelValue', value: string): void\n}>()\n\nconst inputEl = ref<HTMLInputElement | null>(null)\n\nfunction focus(): void {\n  inputEl.value?.focus()\n}\n\ndefineExpose({\n  focus,\n})\n\nconst slots = useSlots()\n\nconst hasPrefix = computed(() => Boolean(slots.prefix))\nconst hasSuffix = computed(() => Boolean(slots.suffix))\n\nconst defaultAddonMinWidth = computed(() => {\n  const map: Record<NonNullable<typeof props.size>, string> = {\n    xs: '2rem', // w-8\n    sm: '2.25rem', // w-9\n    md: '2.5rem', // w-10\n    lg: '3rem', // w-12\n  }\n\n  return map[props.size]\n})\n\nconst prefixMinWidth = computed(() => props.prefixMinWidth ?? defaultAddonMinWidth.value)\nconst suffixMinWidth = computed(() => props.suffixMinWidth ?? defaultAddonMinWidth.value)\n\nconst prefixEl = ref<HTMLElement | null>(null)\nconst suffixEl = ref<HTMLElement | null>(null)\n\nconst measuredPrefixWidth = ref<string | undefined>(undefined)\nconst measuredSuffixWidth = ref<string | undefined>(undefined)\n\nlet ro: ResizeObserver | null = null\nlet scheduled = false\n\nfunction readWidthPx(el: HTMLElement | null): string | undefined {\n  if (!el) return undefined\n\n  const width = Math.ceil(el.getBoundingClientRect().width || 0)\n  // jsdom often reports 0; don't overwrite fallback minWidth in that case.\n  if (width <= 0) return undefined\n\n  return `${width}px`\n}\n\nfunction measure(): void {\n  measuredPrefixWidth.value = hasPrefix.value ? readWidthPx(prefixEl.value) : undefined\n  measuredSuffixWidth.value = hasSuffix.value ? readWidthPx(suffixEl.value) : undefined\n}\n\nfunction refreshObserver(): void {\n  if (typeof ResizeObserver === 'undefined') return\n  if (!ro) ro = new ResizeObserver(() => measure())\n\n  ro.disconnect()\n  if (prefixEl.value) ro.observe(prefixEl.value)\n  if (suffixEl.value) ro.observe(suffixEl.value)\n}\n\nfunction scheduleMeasure(): void {\n  if (scheduled) return\n  scheduled = true\n\n  void nextTick(() => {\n    scheduled = false\n    measure()\n    refreshObserver()\n  })\n}\n\nonMounted(() => scheduleMeasure())\nonUpdated(() => scheduleMeasure())\nonBeforeUnmount(() => ro?.disconnect())\n\nfunction addLen(a: string, b: string): string {\n  if (a === '0px') return b\n  if (b === '0px') return a\n\n  const apx = a.endsWith('px') ? Number(a.slice(0, -2)) : null\n  const bpx = b.endsWith('px') ? Number(b.slice(0, -2)) : null\n\n  if (apx !== null && Number.isFinite(apx) && bpx !== null && Number.isFinite(bpx)) {\n    return `${apx + bpx}px`\n  }\n\n  return `calc(${a} + ${b})`\n}\n\nconst basePaddingXLen = computed(() => {\n  // Must mirror `sizeClass` horizontal padding (px-*) because inline paddings override class paddings.\n  const map: Record<NonNullable<typeof props.size>, string> = {\n    xs: '10px', // px-2.5\n    sm: '12px', // px-3\n    md: '12px', // px-3\n    lg: '16px', // px-4\n  }\n\n  return map[props.size]\n})\n\nconst inputStyle = computed(() => {\n  const leftReserved = hasPrefix.value ? measuredPrefixWidth.value ?? prefixMinWidth.value : '0px'\n  const rightReserved = hasSuffix.value ? measuredSuffixWidth.value ?? suffixMinWidth.value : '0px'\n\n  // Keep the same visual text padding as without addons (px-*), but add it on top of reserved space.\n  const left = hasPrefix.value ? addLen(leftReserved, basePaddingXLen.value) : undefined\n  const right = hasSuffix.value ? addLen(rightReserved, basePaddingXLen.value) : undefined\n\n  return {\n    paddingLeft: left,\n    paddingRight: right,\n  } as Record<string, string | undefined>\n})\n\nconst prefixStyle = computed(() => {\n  return {\n    minWidth: prefixMinWidth.value,\n    maxWidth: props.prefixMaxWidth,\n  } as Record<string, string | undefined>\n})\n\nconst suffixStyle = computed(() => {\n  return {\n    minWidth: suffixMinWidth.value,\n    maxWidth: props.suffixMaxWidth,\n  } as Record<string, string | undefined>\n})\n\nconst sizeClass = computed(() => {\n  const map: Record<NonNullable<typeof props.size>, string> = {\n    xs: 'h-7 px-2.5 text-[12px]',\n    sm: 'h-8 px-3 text-[13px]',\n    md: 'h-10 px-3 text-[14px]',\n    lg: 'h-11 px-4 text-[16px]',\n  }\n\n  return map[props.size]\n})\n\nconst textAlignClass = computed(() => {\n  const map: Record<NonNullable<typeof props.textAlign>, string> = {\n    left: 'text-left',\n    center: 'text-center',\n    right: 'text-right',\n  }\n\n  return map[props.textAlign]\n})\n\nconst className = computed(() => {\n  const state = props.state\n\n  const borderByState: Record<typeof state, string> = {\n    default: 'border-[var(--brd)]',\n    success: 'border-[var(--ds-success)] focus-visible:ring-[var(--ds-success)]',\n    warning: 'border-[var(--ds-warning)] focus-visible:ring-[var(--ds-warning)]',\n    danger: 'border-[var(--ds-danger)] focus-visible:ring-[var(--ds-danger)]',\n  }\n\n  return [\n    sizeClass.value,\n    textAlignClass.value,\n    props.invalid ? borderByState.danger : borderByState[state],\n  ].join(' ')\n})\n\nfunction onInput(e: Event): void {\n  emit('update:modelValue', (e.target as HTMLInputElement).value)\n}\n</script>\n\n<template>\n  <div class=\"relative w-full\">\n    <div\n        v-if=\"$slots.prefix\"\n        ref=\"prefixEl\"\n        data-testid=\"ds-input-prefix\"\n        class=\"absolute inset-y-0 left-0 flex items-center justify-center border-r border-[var(--brd)] px-2 text-[var(--muted-fg)] pointer-events-none select-none truncate\"\n        :style=\"prefixStyle\"\n        aria-hidden=\"true\"\n    >\n      <slot name=\"prefix\" />\n    </div>\n\n    <input\n        :id=\"props.id\"\n        ref=\"inputEl\"\n        v-bind=\"$attrs\"\n        :name=\"props.name\"\n        :type=\"props.type\"\n        :inputmode=\"props.inputmode\"\n        :autocomplete=\"props.autocomplete\"\n        :placeholder=\"props.placeholder\"\n        :disabled=\"props.disabled\"\n        :value=\"props.modelValue\"\n        :aria-invalid=\"props.invalid ? 'true' : undefined\"\n        class=\"w-full rounded-md border bg-[var(--bg)] text-[var(--fg)] placeholder:text-[var(--muted-fg)] focus:placeholder:text-transparent transition-colors duration-150 focus:outline-none focus-visible:ring-2 focus-visible:ring-[var(--ring)] disabled:opacity-50 disabled:cursor-not-allowed\"\n        :class=\"className\"\n        :style=\"inputStyle\"\n        @input=\"onInput\"\n    >\n\n    <div\n        v-if=\"$slots.suffix\"\n        ref=\"suffixEl\"\n        data-testid=\"ds-input-suffix\"\n        class=\"absolute inset-y-0 right-0 flex items-center justify-center border-l border-[var(--brd)] px-2 text-[var(--muted-fg)] pointer-events-none select-none truncate\"\n        :style=\"suffixStyle\"\n        aria-hidden=\"true\"\n    >\n      <slot name=\"suffix\" />\n    </div>\n  </div>\n</template>\n","<script setup lang=\"ts\">\nimport {computed, nextTick, onBeforeUnmount, onMounted, onUpdated, ref, useSlots} from 'vue'\nimport type {InputHTMLAttributes} from 'vue'\n\ndefineOptions({\n  inheritAttrs: false,\n})\n\nexport type GrInputSize = 'xs' | 'sm' | 'md' | 'lg'\nexport type GrInputTextAlign = 'left' | 'center' | 'right'\n\nconst props = withDefaults(\n    defineProps<{\n      modelValue: string\n      type?: 'text' | 'email' | 'password' | 'number' | 'search'\n      placeholder?: string\n      autocomplete?: string\n      inputmode?: InputHTMLAttributes['inputmode']\n      disabled?: boolean\n      invalid?: boolean\n      state?: 'default' | 'success' | 'warning' | 'danger'\n      name?: string\n      id?: string\n      size?: GrInputSize\n\n      textAlign?: GrInputTextAlign\n\n      prefixMinWidth?: string\n      prefixMaxWidth?: string\n      suffixMinWidth?: string\n      suffixMaxWidth?: string\n    }>(),\n    {\n      type: 'text',\n      placeholder: undefined,\n      autocomplete: undefined,\n      inputmode: undefined,\n      disabled: false,\n      invalid: false,\n      state: 'default',\n      name: undefined,\n      id: undefined,\n      size: 'md',\n\n      textAlign: 'left',\n\n      prefixMinWidth: undefined,\n      prefixMaxWidth: undefined,\n      suffixMinWidth: undefined,\n      suffixMaxWidth: undefined,\n    },\n)\n\nconst emit = defineEmits<{\n  (e: 'update:modelValue', value: string): void\n}>()\n\nconst inputEl = ref<HTMLInputElement | null>(null)\n\nfunction focus(): void {\n  inputEl.value?.focus()\n}\n\ndefineExpose({\n  focus,\n})\n\nconst slots = useSlots()\n\nconst hasPrefix = computed(() => Boolean(slots.prefix))\nconst hasSuffix = computed(() => Boolean(slots.suffix))\n\nconst defaultAddonMinWidth = computed(() => {\n  const map: Record<NonNullable<typeof props.size>, string> = {\n    xs: '2rem', // w-8\n    sm: '2.25rem', // w-9\n    md: '2.5rem', // w-10\n    lg: '3rem', // w-12\n  }\n\n  return map[props.size]\n})\n\nconst prefixMinWidth = computed(() => props.prefixMinWidth ?? defaultAddonMinWidth.value)\nconst suffixMinWidth = computed(() => props.suffixMinWidth ?? defaultAddonMinWidth.value)\n\nconst prefixEl = ref<HTMLElement | null>(null)\nconst suffixEl = ref<HTMLElement | null>(null)\n\nconst measuredPrefixWidth = ref<string | undefined>(undefined)\nconst measuredSuffixWidth = ref<string | undefined>(undefined)\n\nlet ro: ResizeObserver | null = null\nlet scheduled = false\n\nfunction readWidthPx(el: HTMLElement | null): string | undefined {\n  if (!el) return undefined\n\n  const width = Math.ceil(el.getBoundingClientRect().width || 0)\n  // jsdom often reports 0; don't overwrite fallback minWidth in that case.\n  if (width <= 0) return undefined\n\n  return `${width}px`\n}\n\nfunction measure(): void {\n  measuredPrefixWidth.value = hasPrefix.value ? readWidthPx(prefixEl.value) : undefined\n  measuredSuffixWidth.value = hasSuffix.value ? readWidthPx(suffixEl.value) : undefined\n}\n\nfunction refreshObserver(): void {\n  if (typeof ResizeObserver === 'undefined') return\n  if (!ro) ro = new ResizeObserver(() => measure())\n\n  ro.disconnect()\n  if (prefixEl.value) ro.observe(prefixEl.value)\n  if (suffixEl.value) ro.observe(suffixEl.value)\n}\n\nfunction scheduleMeasure(): void {\n  if (scheduled) return\n  scheduled = true\n\n  void nextTick(() => {\n    scheduled = false\n    measure()\n    refreshObserver()\n  })\n}\n\nonMounted(() => scheduleMeasure())\nonUpdated(() => scheduleMeasure())\nonBeforeUnmount(() => ro?.disconnect())\n\nfunction addLen(a: string, b: string): string {\n  if (a === '0px') return b\n  if (b === '0px') return a\n\n  const apx = a.endsWith('px') ? Number(a.slice(0, -2)) : null\n  const bpx = b.endsWith('px') ? Number(b.slice(0, -2)) : null\n\n  if (apx !== null && Number.isFinite(apx) && bpx !== null && Number.isFinite(bpx)) {\n    return `${apx + bpx}px`\n  }\n\n  return `calc(${a} + ${b})`\n}\n\nconst basePaddingXLen = computed(() => {\n  // Must mirror `sizeClass` horizontal padding (px-*) because inline paddings override class paddings.\n  const map: Record<NonNullable<typeof props.size>, string> = {\n    xs: '10px', // px-2.5\n    sm: '12px', // px-3\n    md: '12px', // px-3\n    lg: '16px', // px-4\n  }\n\n  return map[props.size]\n})\n\nconst inputStyle = computed(() => {\n  const leftReserved = hasPrefix.value ? measuredPrefixWidth.value ?? prefixMinWidth.value : '0px'\n  const rightReserved = hasSuffix.value ? measuredSuffixWidth.value ?? suffixMinWidth.value : '0px'\n\n  // Keep the same visual text padding as without addons (px-*), but add it on top of reserved space.\n  const left = hasPrefix.value ? addLen(leftReserved, basePaddingXLen.value) : undefined\n  const right = hasSuffix.value ? addLen(rightReserved, basePaddingXLen.value) : undefined\n\n  return {\n    paddingLeft: left,\n    paddingRight: right,\n  } as Record<string, string | undefined>\n})\n\nconst prefixStyle = computed(() => {\n  return {\n    minWidth: prefixMinWidth.value,\n    maxWidth: props.prefixMaxWidth,\n  } as Record<string, string | undefined>\n})\n\nconst suffixStyle = computed(() => {\n  return {\n    minWidth: suffixMinWidth.value,\n    maxWidth: props.suffixMaxWidth,\n  } as Record<string, string | undefined>\n})\n\nconst sizeClass = computed(() => {\n  const map: Record<NonNullable<typeof props.size>, string> = {\n    xs: 'h-7 px-2.5 text-[12px]',\n    sm: 'h-8 px-3 text-[13px]',\n    md: 'h-10 px-3 text-[14px]',\n    lg: 'h-11 px-4 text-[16px]',\n  }\n\n  return map[props.size]\n})\n\nconst textAlignClass = computed(() => {\n  const map: Record<NonNullable<typeof props.textAlign>, string> = {\n    left: 'text-left',\n    center: 'text-center',\n    right: 'text-right',\n  }\n\n  return map[props.textAlign]\n})\n\nconst className = computed(() => {\n  const state = props.state\n\n  const borderByState: Record<typeof state, string> = {\n    default: 'border-[var(--brd)]',\n    success: 'border-[var(--ds-success)] focus-visible:ring-[var(--ds-success)]',\n    warning: 'border-[var(--ds-warning)] focus-visible:ring-[var(--ds-warning)]',\n    danger: 'border-[var(--ds-danger)] focus-visible:ring-[var(--ds-danger)]',\n  }\n\n  return [\n    sizeClass.value,\n    textAlignClass.value,\n    props.invalid ? borderByState.danger : borderByState[state],\n  ].join(' ')\n})\n\nfunction onInput(e: Event): void {\n  emit('update:modelValue', (e.target as HTMLInputElement).value)\n}\n</script>\n\n<template>\n  <div class=\"relative w-full\">\n    <div\n        v-if=\"$slots.prefix\"\n        ref=\"prefixEl\"\n        data-testid=\"ds-input-prefix\"\n        class=\"absolute inset-y-0 left-0 flex items-center justify-center border-r border-[var(--brd)] px-2 text-[var(--muted-fg)] pointer-events-none select-none truncate\"\n        :style=\"prefixStyle\"\n        aria-hidden=\"true\"\n    >\n      <slot name=\"prefix\" />\n    </div>\n\n    <input\n        :id=\"props.id\"\n        ref=\"inputEl\"\n        v-bind=\"$attrs\"\n        :name=\"props.name\"\n        :type=\"props.type\"\n        :inputmode=\"props.inputmode\"\n        :autocomplete=\"props.autocomplete\"\n        :placeholder=\"props.placeholder\"\n        :disabled=\"props.disabled\"\n        :value=\"props.modelValue\"\n        :aria-invalid=\"props.invalid ? 'true' : undefined\"\n        class=\"w-full rounded-md border bg-[var(--bg)] text-[var(--fg)] placeholder:text-[var(--muted-fg)] focus:placeholder:text-transparent transition-colors duration-150 focus:outline-none focus-visible:ring-2 focus-visible:ring-[var(--ring)] disabled:opacity-50 disabled:cursor-not-allowed\"\n        :class=\"className\"\n        :style=\"inputStyle\"\n        @input=\"onInput\"\n    >\n\n    <div\n        v-if=\"$slots.suffix\"\n        ref=\"suffixEl\"\n        data-testid=\"ds-input-suffix\"\n        class=\"absolute inset-y-0 right-0 flex items-center justify-center border-l border-[var(--brd)] px-2 text-[var(--muted-fg)] pointer-events-none select-none truncate\"\n        :style=\"suffixStyle\"\n        aria-hidden=\"true\"\n    >\n      <slot name=\"suffix\" />\n    </div>\n  </div>\n</template>\n"],"mappings":"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"}

package/dist/components/GrInput/index.js

@@ -1,3 +1,3 @@
-import { t as e } from "./chunks/GrInput-CLKX1inm.js";
-import { n as t, t as n } from "../../chunks/config-C1Sn7mn-.js";
-export { e as GrInput, e as default, n as grInputConfig, t as grInputSafelist };
+import { t as GrInput_default } from "./chunks/GrInput-ghxaTf6d.js";
+import { n as grInputSafelist, t as grInputConfig } from "../../chunks/config-D19pyP4D.js";
+export { GrInput_default as GrInput, GrInput_default as default, grInputConfig, grInputSafelist };

package/dist/components/GrInputTag/chunks/GrInputTag-B0x4U0Yk.js

@@ -0,0 +1,257 @@
+import { t as x_default } from "../../../chunks/x-Pa6C2hwi.js";
+import { t as GrBadge_default } from "../../GrBadge/chunks/GrBadge-wuIb4_2K.js";
+import { t as GrIcon_default } from "../../GrIcon/chunks/GrIcon-BV7RBU_0.js";
+import { i as grInputTagWrapperClass, r as grInputTagInputClass } from "../../../chunks/config-DgRJlF00.js";
+import { Fragment, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createVNode, defineComponent, normalizeClass, openBlock, ref, renderList, renderSlot, toDisplayString, unref, withCtx, withModifiers } from "vue";
+//#region src/components/GrInputTag/GrInputTag.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1 = { class: "truncate max-w-[18rem]" };
+var _hoisted_2 = [
+	"aria-label",
+	"data-index",
+	"onClick"
+];
+var _hoisted_3 = [
+	"value",
+	"disabled",
+	"readonly",
+	"placeholder",
+	"aria-invalid"
+];
+//#endregion
+//#region src/components/GrInputTag/GrInputTag.vue
+var GrInputTag_default = /* @__PURE__ */ defineComponent({
+	__name: "GrInputTag",
+	props: {
+		modelValue: {},
+		placeholder: { default: void 0 },
+		disabled: {
+			type: Boolean,
+			default: false
+		},
+		readonly: {
+			type: Boolean,
+			default: false
+		},
+		invalid: {
+			type: Boolean,
+			default: false
+		},
+		state: { default: "default" },
+		size: { default: "md" },
+		separators: { default: () => [","] },
+		allowDuplicates: {
+			type: Boolean,
+			default: false
+		},
+		trim: {
+			type: Boolean,
+			default: true
+		},
+		max: { default: void 0 },
+		addOnBlur: {
+			type: Boolean,
+			default: false
+		},
+		clearInputOnAdd: {
+			type: Boolean,
+			default: true
+		},
+		tagTone: { default: "neutral" },
+		tagDark: {
+			type: Boolean,
+			default: false
+		},
+		tagSize: { default: "md" },
+		tagRadius: { default: "round" },
+		tagClosable: {
+			type: Boolean,
+			default: true
+		},
+		removeTagLabel: { default: "Remove tag" }
+	},
+	emits: [
+		"update:modelValue",
+		"add",
+		"remove"
+	],
+	setup(__props, { expose: __expose, emit: __emit }) {
+		const REGEX_SPECIAL_CHAR_RE = /[.*+?^${}()|[\]\\]/g;
+		/**
+		* Props for {@link GrInputTag}.
+		* Tag-input primitive: renders a set of badges with an inline `<input>` for entering new tags.
+		* Splits input by configurable `separators`, supports paste, Enter and Backspace editing.
+		*/
+		const props = __props;
+		const emit = __emit;
+		const inputValue = ref("");
+		const inputEl = ref(null);
+		function focus() {
+			inputEl.value?.focus();
+		}
+		__expose({ focus });
+		const isMaxed = computed(() => props.max !== void 0 && props.modelValue.length >= props.max);
+		const canEdit = computed(() => !props.disabled && !props.readonly);
+		const showRemove = computed(() => props.tagClosable && canEdit.value);
+		function escapeRegexChar(ch) {
+			return ch.replace(REGEX_SPECIAL_CHAR_RE, "\\$&");
+		}
+		const splitRegex = computed(() => {
+			const seps = (props.separators ?? []).filter(Boolean).map((s) => s[0]);
+			const body = [...new Set([
+				...seps,
+				"\n",
+				"\r",
+				"	"
+			])].map(escapeRegexChar).join("");
+			return new RegExp(`[${body}]+`, "g");
+		});
+		function normalizeTag(raw) {
+			return props.trim ? raw.trim() : raw;
+		}
+		function splitToTags(raw) {
+			return raw.split(splitRegex.value).map((v) => normalizeTag(v)).filter(Boolean);
+		}
+		function addMany(rawTags) {
+			if (!canEdit.value || isMaxed.value) return false;
+			const next = props.modelValue.slice();
+			let changed = false;
+			for (const raw of rawTags) {
+				const tag = normalizeTag(raw);
+				if (!tag) continue;
+				if (!props.allowDuplicates && next.includes(tag)) continue;
+				if (props.max !== void 0 && next.length >= props.max) break;
+				next.push(tag);
+				changed = true;
+				emit("add", tag);
+			}
+			if (!changed) return false;
+			emit("update:modelValue", next);
+			return true;
+		}
+		function commitInput() {
+			if (!canEdit.value || isMaxed.value || !inputValue.value) return;
+			const tags = splitToTags(inputValue.value);
+			if (!tags.length) return;
+			if (addMany(tags) && props.clearInputOnAdd) inputValue.value = "";
+		}
+		function removeAt(index) {
+			if (!canEdit.value) return;
+			const next = props.modelValue.slice();
+			const removed = next[index];
+			if (removed === void 0) return;
+			next.splice(index, 1);
+			emit("update:modelValue", next);
+			emit("remove", removed, index);
+		}
+		function onInput(e) {
+			inputValue.value = e.target.value;
+		}
+		function onKeydown(e) {
+			if (!canEdit.value) return;
+			if (e.key === "Enter") {
+				e.preventDefault();
+				commitInput();
+				return;
+			}
+			if ((props.separators ?? []).includes(e.key)) {
+				e.preventDefault();
+				commitInput();
+				return;
+			}
+			if (e.key === "Backspace" && inputValue.value.length === 0 && props.modelValue.length > 0) {
+				e.preventDefault();
+				removeAt(props.modelValue.length - 1);
+			}
+		}
+		function onBlur() {
+			if (props.addOnBlur) commitInput();
+		}
+		function onPaste(e) {
+			if (!canEdit.value || isMaxed.value) return;
+			const pasted = e.clipboardData?.getData("text");
+			if (!pasted) return;
+			const tags = splitToTags(pasted);
+			if (tags.length <= 1) return;
+			e.preventDefault();
+			addMany(tags);
+		}
+		const wrapperClassName = computed(() => {
+			return grInputTagWrapperClass({
+				size: props.size,
+				state: props.state,
+				invalid: props.invalid,
+				disabled: props.disabled
+			});
+		});
+		const inputClassName = computed(() => {
+			return grInputTagInputClass(props.size);
+		});
+		const placeholderText = computed(() => props.modelValue.length > 0 ? void 0 : props.placeholder);
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("div", {
+				"data-ds-input-tag": "",
+				"data-testid": "ds-input-tag",
+				class: normalizeClass(["w-full flex flex-wrap items-center rounded-md border bg-[var(--bg)] text-[var(--fg)] transition-colors duration-150 focus-within:ring-2 focus-within:ring-[var(--ring)]", wrapperClassName.value]),
+				onClick: focus
+			}, [(openBlock(true), createElementBlock(Fragment, null, renderList(__props.modelValue, (tag, i) => {
+				return openBlock(), createBlock(GrBadge_default, {
+					key: `${tag}-${i}`,
+					tone: __props.tagTone,
+					dark: __props.tagDark,
+					size: __props.tagSize,
+					radius: __props.tagRadius,
+					class: "gap-1",
+					"data-ds-input-tag-item": "",
+					"data-testid": "ds-input-tag-item",
+					"data-index": i
+				}, {
+					default: withCtx(() => [renderSlot(_ctx.$slots, "tag", {
+						tag,
+						index: i,
+						remove: () => removeAt(i)
+					}, () => [createElementVNode("span", _hoisted_1, toDisplayString(tag), 1)]), showRemove.value ? (openBlock(), createElementBlock("button", {
+						key: 0,
+						type: "button",
+						class: "-mr-0.5 inline-flex items-center justify-center rounded-[6px] p-0.5 opacity-70 hover:opacity-100 focus:outline-none focus-visible:ring-2 focus-visible:ring-[var(--ring)]",
+						"aria-label": __props.removeTagLabel,
+						"data-ds-input-tag-remove": "",
+						"data-testid": "ds-input-tag-remove",
+						"data-index": i,
+						onMousedown: _cache[0] || (_cache[0] = withModifiers(() => {}, ["prevent", "stop"])),
+						onClick: withModifiers(($event) => removeAt(i), ["stop"])
+					}, [createVNode(GrIcon_default, {
+						size: "sm",
+						"aria-hidden": "true"
+					}, {
+						default: withCtx(() => [createVNode(unref(x_default))]),
+						_: 1
+					})], 40, _hoisted_2)) : createCommentVNode("", true)]),
+					_: 2
+				}, 1032, [
+					"tone",
+					"dark",
+					"size",
+					"radius",
+					"data-index"
+				]);
+			}), 128)), createElementVNode("input", {
+				ref_key: "inputEl",
+				ref: inputEl,
+				"data-ds-input-tag-input": "",
+				"data-testid": "ds-input-tag-input",
+				value: inputValue.value,
+				disabled: __props.disabled || isMaxed.value,
+				readonly: __props.readonly,
+				placeholder: placeholderText.value,
+				"aria-invalid": __props.invalid ? "true" : void 0,
+				class: normalizeClass(["flex-1 min-w-[120px] bg-transparent border-none outline-none placeholder:text-[var(--muted-fg)]", inputClassName.value]),
+				onInput,
+				onKeydown,
+				onBlur,
+				onPaste
+			}, null, 42, _hoisted_3)], 2);
+		};
+	}
+});
+//#endregion
+export { GrInputTag_default as t };

package/dist/components/GrInputTag/chunks/GrInputTag-B0x4U0Yk.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"GrInputTag-B0x4U0Yk.js","names":[],"sources":["../../../../src/components/GrInputTag/GrInputTag.vue","../../../../src/components/GrInputTag/GrInputTag.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, ref } from 'vue'\n\nimport GrBadge from '../GrBadge/GrBadge.vue'\nimport type { GrBadgeRadius, GrBadgeSize, GrBadgeTone } from '../GrBadge'\nimport GrIcon from '../GrIcon/GrIcon.vue'\nimport IconClose from '~icons/lucide/x'\n\nimport {\n  grInputTagInputClass,\n  grInputTagWrapperClass,\n  type GrInputTagSize,\n  type GrInputTagState,\n} from './grInputTagStyles'\n\nexport type { GrInputTagSize, GrInputTagState } from './grInputTagStyles'\n\nconst REGEX_SPECIAL_CHAR_RE = /[.*+?^${}()|[\\]\\\\]/g\n\n/**\n * Props for {@link GrInputTag}.\n * Tag-input primitive: renders a set of badges with an inline `<input>` for entering new tags.\n * Splits input by configurable `separators`, supports paste, Enter and Backspace editing.\n */\nexport interface GrInputTagProps {\n  modelValue: string[]\n  placeholder?: string\n  disabled?: boolean\n  readonly?: boolean\n  invalid?: boolean\n  state?: GrInputTagState\n  size?: GrInputTagSize\n  separators?: string[]\n  allowDuplicates?: boolean\n  trim?: boolean\n  max?: number\n  addOnBlur?: boolean\n  clearInputOnAdd?: boolean\n  tagTone?: GrBadgeTone\n  tagDark?: boolean\n  tagSize?: GrBadgeSize\n  tagRadius?: GrBadgeRadius\n  tagClosable?: boolean\n  /** i18n-friendly aria-label for the per-tag remove button. */\n  removeTagLabel?: string\n}\n\nconst props = withDefaults(\n  defineProps<GrInputTagProps>(),\n  {\n    placeholder: undefined,\n    disabled: false,\n    readonly: false,\n    invalid: false,\n    state: 'default',\n    size: 'md',\n    separators: () => [','],\n    allowDuplicates: false,\n    trim: true,\n    max: undefined,\n    addOnBlur: false,\n    clearInputOnAdd: true,\n    tagTone: 'neutral',\n    tagDark: false,\n    tagSize: 'md',\n    tagRadius: 'round',\n    tagClosable: true,\n    removeTagLabel: 'Remove tag',\n  },\n)\n\nconst emit = defineEmits<{\n  (e: 'update:modelValue', value: string[]): void\n  (e: 'add', value: string): void\n  (e: 'remove', value: string, index: number): void\n}>()\n\nconst inputValue = ref('')\nconst inputEl = ref<HTMLInputElement | null>(null)\n\nfunction focus(): void {\n  inputEl.value?.focus()\n}\n\ndefineExpose({ focus })\n\nconst isMaxed = computed(() => props.max !== undefined && props.modelValue.length >= props.max)\nconst canEdit = computed(() => !props.disabled && !props.readonly)\nconst showRemove = computed(() => props.tagClosable && canEdit.value)\n\nfunction escapeRegexChar(ch: string): string {\n  return ch.replace(REGEX_SPECIAL_CHAR_RE, '\\\\$&')\n}\n\nconst splitRegex = computed(() => {\n  const seps = (props.separators ?? []).filter(Boolean).map(s => s[0]!)\n  const uniq = [...new Set([...seps, '\\n', '\\r', '\\t'])]\n  const body = uniq.map(escapeRegexChar).join('')\n  return new RegExp(`[${body}]+`, 'g')\n})\n\nfunction normalizeTag(raw: string): string {\n  return props.trim ? raw.trim() : raw\n}\n\nfunction splitToTags(raw: string): string[] {\n  return raw\n    .split(splitRegex.value)\n    .map(v => normalizeTag(v))\n    .filter(Boolean)\n}\n\nfunction addMany(rawTags: string[]): boolean {\n  if (!canEdit.value || isMaxed.value)\n    return false\n\n  const next = props.modelValue.slice()\n  let changed = false\n\n  for (const raw of rawTags) {\n    const tag = normalizeTag(raw)\n    if (!tag)\n      continue\n\n    if (!props.allowDuplicates && next.includes(tag))\n      continue\n\n    if (props.max !== undefined && next.length >= props.max)\n      break\n\n    next.push(tag)\n    changed = true\n    emit('add', tag)\n  }\n\n  if (!changed)\n    return false\n\n  emit('update:modelValue', next)\n  return true\n}\n\nfunction commitInput(): void {\n  if (!canEdit.value || isMaxed.value || !inputValue.value)\n    return\n\n  const tags = splitToTags(inputValue.value)\n  if (!tags.length)\n    return\n\n  const changed = addMany(tags)\n  if (changed && props.clearInputOnAdd)\n    inputValue.value = ''\n}\n\nfunction removeAt(index: number): void {\n  if (!canEdit.value)\n    return\n\n  const next = props.modelValue.slice()\n  const removed = next[index]\n  if (removed === undefined)\n    return\n\n  next.splice(index, 1)\n  emit('update:modelValue', next)\n  emit('remove', removed, index)\n}\n\nfunction onInput(e: Event): void {\n  inputValue.value = (e.target as HTMLInputElement).value\n}\n\nfunction onKeydown(e: KeyboardEvent): void {\n  if (!canEdit.value)\n    return\n\n  if (e.key === 'Enter') {\n    e.preventDefault()\n    commitInput()\n    return\n  }\n\n  if ((props.separators ?? []).includes(e.key)) {\n    e.preventDefault()\n    commitInput()\n    return\n  }\n\n  if (e.key === 'Backspace' && inputValue.value.length === 0 && props.modelValue.length > 0) {\n    e.preventDefault()\n    removeAt(props.modelValue.length - 1)\n  }\n}\n\nfunction onBlur(): void {\n  if (props.addOnBlur)\n    commitInput()\n}\n\nfunction onPaste(e: ClipboardEvent): void {\n  if (!canEdit.value || isMaxed.value)\n    return\n\n  const pasted = e.clipboardData?.getData('text')\n  if (!pasted)\n    return\n\n  const tags = splitToTags(pasted)\n  if (tags.length <= 1)\n    return\n\n  e.preventDefault()\n  addMany(tags)\n}\n\nconst wrapperClassName = computed(() => {\n  return grInputTagWrapperClass({\n    size: props.size,\n    state: props.state,\n    invalid: props.invalid,\n    disabled: props.disabled,\n  })\n})\n\nconst inputClassName = computed(() => {\n  return grInputTagInputClass(props.size)\n})\n\nconst placeholderText = computed(() => props.modelValue.length > 0 ? undefined : props.placeholder)\n</script>\n\n<template>\n  <div\n    data-ds-input-tag\n    data-testid=\"ds-input-tag\"\n    class=\"w-full flex flex-wrap items-center rounded-md border bg-[var(--bg)] text-[var(--fg)] transition-colors duration-150 focus-within:ring-2 focus-within:ring-[var(--ring)]\"\n    :class=\"wrapperClassName\"\n    @click=\"focus\"\n  >\n    <GrBadge\n      v-for=\"(tag, i) in modelValue\"\n      :key=\"`${tag}-${i}`\"\n      :tone=\"tagTone\"\n      :dark=\"tagDark\"\n      :size=\"tagSize\"\n      :radius=\"tagRadius\"\n      class=\"gap-1\"\n      data-ds-input-tag-item\n      data-testid=\"ds-input-tag-item\"\n      :data-index=\"i\"\n    >\n      <slot name=\"tag\" :tag=\"tag\" :index=\"i\" :remove=\"() => removeAt(i)\">\n        <span class=\"truncate max-w-[18rem]\">{{ tag }}</span>\n      </slot>\n\n      <button\n        v-if=\"showRemove\"\n        type=\"button\"\n        class=\"-mr-0.5 inline-flex items-center justify-center rounded-[6px] p-0.5 opacity-70 hover:opacity-100 focus:outline-none focus-visible:ring-2 focus-visible:ring-[var(--ring)]\"\n        :aria-label=\"removeTagLabel\"\n        data-ds-input-tag-remove\n        data-testid=\"ds-input-tag-remove\"\n        :data-index=\"i\"\n        @mousedown.prevent.stop\n        @click.stop=\"removeAt(i)\"\n      >\n        <GrIcon size=\"sm\" aria-hidden=\"true\">\n          <IconClose />\n        </GrIcon>\n      </button>\n    </GrBadge>\n\n    <input\n      ref=\"inputEl\"\n      data-ds-input-tag-input\n      data-testid=\"ds-input-tag-input\"\n      :value=\"inputValue\"\n      :disabled=\"disabled || isMaxed\"\n      :readonly=\"readonly\"\n      :placeholder=\"placeholderText\"\n      :aria-invalid=\"invalid ? 'true' : undefined\"\n      class=\"flex-1 min-w-[120px] bg-transparent border-none outline-none placeholder:text-[var(--muted-fg)]\"\n      :class=\"inputClassName\"\n      @input=\"onInput\"\n      @keydown=\"onKeydown\"\n      @blur=\"onBlur\"\n      @paste=\"onPaste\"\n    >\n  </div>\n</template>\n","<script setup lang=\"ts\">\nimport { computed, ref } from 'vue'\n\nimport GrBadge from '../GrBadge/GrBadge.vue'\nimport type { GrBadgeRadius, GrBadgeSize, GrBadgeTone } from '../GrBadge'\nimport GrIcon from '../GrIcon/GrIcon.vue'\nimport IconClose from '~icons/lucide/x'\n\nimport {\n  grInputTagInputClass,\n  grInputTagWrapperClass,\n  type GrInputTagSize,\n  type GrInputTagState,\n} from './grInputTagStyles'\n\nexport type { GrInputTagSize, GrInputTagState } from './grInputTagStyles'\n\nconst REGEX_SPECIAL_CHAR_RE = /[.*+?^${}()|[\\]\\\\]/g\n\n/**\n * Props for {@link GrInputTag}.\n * Tag-input primitive: renders a set of badges with an inline `<input>` for entering new tags.\n * Splits input by configurable `separators`, supports paste, Enter and Backspace editing.\n */\nexport interface GrInputTagProps {\n  modelValue: string[]\n  placeholder?: string\n  disabled?: boolean\n  readonly?: boolean\n  invalid?: boolean\n  state?: GrInputTagState\n  size?: GrInputTagSize\n  separators?: string[]\n  allowDuplicates?: boolean\n  trim?: boolean\n  max?: number\n  addOnBlur?: boolean\n  clearInputOnAdd?: boolean\n  tagTone?: GrBadgeTone\n  tagDark?: boolean\n  tagSize?: GrBadgeSize\n  tagRadius?: GrBadgeRadius\n  tagClosable?: boolean\n  /** i18n-friendly aria-label for the per-tag remove button. */\n  removeTagLabel?: string\n}\n\nconst props = withDefaults(\n  defineProps<GrInputTagProps>(),\n  {\n    placeholder: undefined,\n    disabled: false,\n    readonly: false,\n    invalid: false,\n    state: 'default',\n    size: 'md',\n    separators: () => [','],\n    allowDuplicates: false,\n    trim: true,\n    max: undefined,\n    addOnBlur: false,\n    clearInputOnAdd: true,\n    tagTone: 'neutral',\n    tagDark: false,\n    tagSize: 'md',\n    tagRadius: 'round',\n    tagClosable: true,\n    removeTagLabel: 'Remove tag',\n  },\n)\n\nconst emit = defineEmits<{\n  (e: 'update:modelValue', value: string[]): void\n  (e: 'add', value: string): void\n  (e: 'remove', value: string, index: number): void\n}>()\n\nconst inputValue = ref('')\nconst inputEl = ref<HTMLInputElement | null>(null)\n\nfunction focus(): void {\n  inputEl.value?.focus()\n}\n\ndefineExpose({ focus })\n\nconst isMaxed = computed(() => props.max !== undefined && props.modelValue.length >= props.max)\nconst canEdit = computed(() => !props.disabled && !props.readonly)\nconst showRemove = computed(() => props.tagClosable && canEdit.value)\n\nfunction escapeRegexChar(ch: string): string {\n  return ch.replace(REGEX_SPECIAL_CHAR_RE, '\\\\$&')\n}\n\nconst splitRegex = computed(() => {\n  const seps = (props.separators ?? []).filter(Boolean).map(s => s[0]!)\n  const uniq = [...new Set([...seps, '\\n', '\\r', '\\t'])]\n  const body = uniq.map(escapeRegexChar).join('')\n  return new RegExp(`[${body}]+`, 'g')\n})\n\nfunction normalizeTag(raw: string): string {\n  return props.trim ? raw.trim() : raw\n}\n\nfunction splitToTags(raw: string): string[] {\n  return raw\n    .split(splitRegex.value)\n    .map(v => normalizeTag(v))\n    .filter(Boolean)\n}\n\nfunction addMany(rawTags: string[]): boolean {\n  if (!canEdit.value || isMaxed.value)\n    return false\n\n  const next = props.modelValue.slice()\n  let changed = false\n\n  for (const raw of rawTags) {\n    const tag = normalizeTag(raw)\n    if (!tag)\n      continue\n\n    if (!props.allowDuplicates && next.includes(tag))\n      continue\n\n    if (props.max !== undefined && next.length >= props.max)\n      break\n\n    next.push(tag)\n    changed = true\n    emit('add', tag)\n  }\n\n  if (!changed)\n    return false\n\n  emit('update:modelValue', next)\n  return true\n}\n\nfunction commitInput(): void {\n  if (!canEdit.value || isMaxed.value || !inputValue.value)\n    return\n\n  const tags = splitToTags(inputValue.value)\n  if (!tags.length)\n    return\n\n  const changed = addMany(tags)\n  if (changed && props.clearInputOnAdd)\n    inputValue.value = ''\n}\n\nfunction removeAt(index: number): void {\n  if (!canEdit.value)\n    return\n\n  const next = props.modelValue.slice()\n  const removed = next[index]\n  if (removed === undefined)\n    return\n\n  next.splice(index, 1)\n  emit('update:modelValue', next)\n  emit('remove', removed, index)\n}\n\nfunction onInput(e: Event): void {\n  inputValue.value = (e.target as HTMLInputElement).value\n}\n\nfunction onKeydown(e: KeyboardEvent): void {\n  if (!canEdit.value)\n    return\n\n  if (e.key === 'Enter') {\n    e.preventDefault()\n    commitInput()\n    return\n  }\n\n  if ((props.separators ?? []).includes(e.key)) {\n    e.preventDefault()\n    commitInput()\n    return\n  }\n\n  if (e.key === 'Backspace' && inputValue.value.length === 0 && props.modelValue.length > 0) {\n    e.preventDefault()\n    removeAt(props.modelValue.length - 1)\n  }\n}\n\nfunction onBlur(): void {\n  if (props.addOnBlur)\n    commitInput()\n}\n\nfunction onPaste(e: ClipboardEvent): void {\n  if (!canEdit.value || isMaxed.value)\n    return\n\n  const pasted = e.clipboardData?.getData('text')\n  if (!pasted)\n    return\n\n  const tags = splitToTags(pasted)\n  if (tags.length <= 1)\n    return\n\n  e.preventDefault()\n  addMany(tags)\n}\n\nconst wrapperClassName = computed(() => {\n  return grInputTagWrapperClass({\n    size: props.size,\n    state: props.state,\n    invalid: props.invalid,\n    disabled: props.disabled,\n  })\n})\n\nconst inputClassName = computed(() => {\n  return grInputTagInputClass(props.size)\n})\n\nconst placeholderText = computed(() => props.modelValue.length > 0 ? undefined : props.placeholder)\n</script>\n\n<template>\n  <div\n    data-ds-input-tag\n    data-testid=\"ds-input-tag\"\n    class=\"w-full flex flex-wrap items-center rounded-md border bg-[var(--bg)] text-[var(--fg)] transition-colors duration-150 focus-within:ring-2 focus-within:ring-[var(--ring)]\"\n    :class=\"wrapperClassName\"\n    @click=\"focus\"\n  >\n    <GrBadge\n      v-for=\"(tag, i) in modelValue\"\n      :key=\"`${tag}-${i}`\"\n      :tone=\"tagTone\"\n      :dark=\"tagDark\"\n      :size=\"tagSize\"\n      :radius=\"tagRadius\"\n      class=\"gap-1\"\n      data-ds-input-tag-item\n      data-testid=\"ds-input-tag-item\"\n      :data-index=\"i\"\n    >\n      <slot name=\"tag\" :tag=\"tag\" :index=\"i\" :remove=\"() => removeAt(i)\">\n        <span class=\"truncate max-w-[18rem]\">{{ tag }}</span>\n      </slot>\n\n      <button\n        v-if=\"showRemove\"\n        type=\"button\"\n        class=\"-mr-0.5 inline-flex items-center justify-center rounded-[6px] p-0.5 opacity-70 hover:opacity-100 focus:outline-none focus-visible:ring-2 focus-visible:ring-[var(--ring)]\"\n        :aria-label=\"removeTagLabel\"\n        data-ds-input-tag-remove\n        data-testid=\"ds-input-tag-remove\"\n        :data-index=\"i\"\n        @mousedown.prevent.stop\n        @click.stop=\"removeAt(i)\"\n      >\n        <GrIcon size=\"sm\" aria-hidden=\"true\">\n          <IconClose />\n        </GrIcon>\n      </button>\n    </GrBadge>\n\n    <input\n      ref=\"inputEl\"\n      data-ds-input-tag-input\n      data-testid=\"ds-input-tag-input\"\n      :value=\"inputValue\"\n      :disabled=\"disabled || isMaxed\"\n      :readonly=\"readonly\"\n      :placeholder=\"placeholderText\"\n      :aria-invalid=\"invalid ? 'true' : undefined\"\n      class=\"flex-1 min-w-[120px] bg-transparent border-none outline-none placeholder:text-[var(--muted-fg)]\"\n      :class=\"inputClassName\"\n      @input=\"onInput\"\n      @keydown=\"onKeydown\"\n      @blur=\"onBlur\"\n      @paste=\"onPaste\"\n    >\n  </div>\n</template>\n"],"mappings":"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"}

package/dist/components/GrInputTag/index.js

@@ -1,3 +1,3 @@
-import { n as e, t } from "../../chunks/config-BhbfV-Is.js";
-import { t as n } from "./chunks/GrInputTag-BAtLody2.js";
-export { n as GrInputTag, n as default, t as grInputTagConfig, e as grInputTagSafelist };
+import { n as grInputTagSafelist, t as grInputTagConfig } from "../../chunks/config-DgRJlF00.js";
+import { t as GrInputTag_default } from "./chunks/GrInputTag-B0x4U0Yk.js";
+export { GrInputTag_default as GrInputTag, GrInputTag_default as default, grInputTagConfig, grInputTagSafelist };

package/dist/components/GrLink/chunks/GrLink-C7-Y1u88.js

@@ -0,0 +1,80 @@
+import { a as grLinkClass, i as focusRingClass, r as baseRootClass } from "../../../chunks/config-Cf0J6wCX.js";
+import { computed, createElementBlock, defineComponent, mergeProps, openBlock, renderSlot, unref, useAttrs } from "vue";
+//#region src/components/GrLink/GrLink.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1 = [
+	"href",
+	"target",
+	"rel",
+	"aria-label"
+];
+var _hoisted_2 = ["aria-label", "aria-disabled"];
+//#endregion
+//#region src/components/GrLink/GrLink.vue
+var GrLink_default = /* @__PURE__ */ defineComponent({
+	inheritAttrs: false,
+	__name: "GrLink",
+	props: {
+		href: { default: void 0 },
+		external: {
+			type: Boolean,
+			default: false
+		},
+		target: { default: void 0 },
+		rel: { default: void 0 },
+		disabled: {
+			type: Boolean,
+			default: false
+		},
+		ariaLabel: { default: void 0 },
+		variant: { default: "primary" },
+		underline: { default: "auto" },
+		size: { default: "md" }
+	},
+	setup(__props) {
+		/**
+		* GrLink — DS-примитив ссылки.
+		*
+		* Корневой тег зависит от пропов:
+		* - `<a>` — когда заданы `href` и не `disabled`;
+		* - `<span>` — во всех остальных случаях (включая `disabled`, даже если `href` задан).
+		*
+		* Это осознанное решение, чтобы отключённая ссылка не была кликабельной и
+		* не участвовала в порядке табуляции. Учтите это в внешних CSS-селекторах.
+		*/
+		const props = __props;
+		const attrs = useAttrs();
+		const isAnchor = computed(() => !!props.href && !props.disabled);
+		const resolvedTarget = computed(() => {
+			if (props.target) return props.target;
+			if (props.external) return "_blank";
+		});
+		const resolvedRel = computed(() => {
+			if (props.rel) return props.rel;
+			if (resolvedTarget.value === "_blank") return "noopener noreferrer";
+		});
+		const rootClass = computed(() => {
+			const variantClass = grLinkClass({
+				size: props.size,
+				underline: props.underline,
+				variant: props.variant,
+				disabled: props.disabled
+			});
+			return props.disabled ? `${baseRootClass} ${variantClass}` : `${baseRootClass} ${focusRingClass} ${variantClass}`;
+		});
+		return (_ctx, _cache) => {
+			return isAnchor.value ? (openBlock(), createElementBlock("a", mergeProps({ key: 0 }, unref(attrs), {
+				href: __props.href,
+				target: resolvedTarget.value,
+				rel: resolvedRel.value,
+				"aria-label": __props.ariaLabel,
+				class: rootClass.value
+			}), [renderSlot(_ctx.$slots, "default")], 16, _hoisted_1)) : (openBlock(), createElementBlock("span", mergeProps({ key: 1 }, unref(attrs), {
+				"aria-label": __props.ariaLabel,
+				"aria-disabled": __props.disabled ? "true" : void 0,
+				class: rootClass.value
+			}), [renderSlot(_ctx.$slots, "default")], 16, _hoisted_2));
+		};
+	}
+});
+//#endregion
+export { GrLink_default as t };