@welldot/vue 0.0.0-stage → 0.1.1

package/dist/grid/cells/GridColorPickerEditor.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"GridColorPickerEditor.d.ts","sourceRoot":"","sources":["../../../src/grid/cells/GridColorPickerEditor.vue"],"names":[],"mappings":"wBA8GqB,OAAO,YAAY;AAAxC,wBAAyC;AACzC,QAAA,MAAM,YAAY;UAEV,OAAO;UACP,CAAC,KAAK,EAAE,OAAO,EAAE,YAAY,CAAC,EAAE,OAAO,KAAK,IAAI;WAC/C,CAAC,SAAS,CAAC,EAAE,OAAO,KAAK,IAAI;;UAF9B,OAAO;UACP,CAAC,KAAK,EAAE,OAAO,EAAE,YAAY,CAAC,EAAE,OAAO,KAAK,IAAI;WAC/C,CAAC,SAAS,CAAC,EAAE,OAAO,KAAK,IAAI;iGAwIlC,CAAC"}

package/dist/grid/cells/GridColorPickerEditor.js

@@ -0,0 +1,7 @@
+import e from "./GridColorPickerEditor.vue_vue_type_script_setup_true_lang.js";
+//#region src/grid/cells/GridColorPickerEditor.vue
+var t = e;
+//#endregion
+export { t as default };
+
+//# sourceMappingURL=GridColorPickerEditor.js.map

package/dist/grid/cells/GridColorPickerEditor.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"GridColorPickerEditor.js","names":[],"sources":["../../../src/grid/cells/GridColorPickerEditor.vue"],"sourcesContent":["<script lang=\"ts\">\n// vue-color's stylesheet is imported dynamically, on the client only. A\n// static `import 'vue-color/style.css'` stays in `dist/` (vue-color is\n// external), so Node would fail to load `@welldot/vue/grid` during plain-Vite\n// SSR unless the app set `ssr.noExternal`. Editors only mount in the browser,\n// and loading at module evaluation means the CSS is there before one opens.\nif (typeof window !== 'undefined') void import('vue-color/style.css');\n</script>\n\n<script setup lang=\"ts\">\nimport Popover from 'primevue/popover';\nimport { SketchPicker, tinycolor } from 'vue-color';\nimport { nextTick, onMounted, onUnmounted, ref } from 'vue';\n\nconst props = defineProps<{\n  val?: unknown;\n  save: (value: unknown, preventFocus?: boolean) => void;\n  close: (focusNext?: boolean) => void;\n}>();\n\ndefineOptions({ inheritAttrs: false });\n\nconst triggerRef = ref<HTMLElement | null>(null);\nconst popoverRef = ref<InstanceType<typeof Popover> | null>(null);\n\n// vue-color echoes back the format of the value it was given (and can drift\n// to HSV objects), so normalize everything to `#rrggbb` on the way in and out.\nfunction toHex(value: unknown): string {\n  const color = tinycolor(value as string);\n  return color.isValid() ? color.toHexString() : '#cccccc';\n}\n\nconst localValue = ref(toHex(props.val));\n\nfunction onKeydown(e: KeyboardEvent) {\n  if (e.key === 'Enter' || e.key === 'Escape') {\n    e.stopPropagation();\n    popoverRef.value?.hide();\n  }\n}\n\nonMounted(() => {\n  nextTick(() => {\n    popoverRef.value?.show(\n      { currentTarget: triggerRef.value } as unknown as Event,\n      triggerRef.value,\n    );\n  });\n  document.addEventListener('keydown', onKeydown, true);\n});\n\nonUnmounted(() => {\n  document.removeEventListener('keydown', onKeydown, true);\n});\n\nfunction onChange(value: unknown) {\n  const hex = toHex(value);\n  localValue.value = hex;\n  props.save(hex, true);\n}\n\nfunction onHide() {\n  props.close();\n}\n</script>\n\n<template>\n  <div\n    ref=\"triggerRef\"\n    class=\"well-cell-color-trigger\"\n    tabindex=\"-1\"\n    @keydown=\"onKeydown\"\n  >\n    <span\n      class=\"well-cell-color-swatch\"\n      :style=\"{ backgroundColor: localValue }\"\n    />\n    <span class=\"well-cell-color-hex\">{{ localValue }}</span>\n  </div>\n\n  <Popover\n    ref=\"popoverRef\"\n    :pt=\"{\n      content: 'p-0',\n    }\"\n    @hide=\"onHide\"\n  >\n    <div @mousedown.stop @click.stop @keydown=\"onKeydown\">\n      <SketchPicker\n        :model-value=\"localValue\"\n        disable-alpha\n        @update:model-value=\"onChange\"\n      />\n    </div>\n  </Popover>\n</template>\n"],"mappings":""}

package/dist/grid/cells/GridColorPickerEditor.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,70 @@
+import { Fragment as e, createElementBlock as t, createElementVNode as n, createVNode as r, defineComponent as i, nextTick as a, normalizeStyle as o, onMounted as s, onUnmounted as c, openBlock as l, ref as u, toDisplayString as d, unref as f, withCtx as p, withModifiers as m } from "vue";
+import h from "primevue/popover";
+import { SketchPicker as g, tinycolor as _ } from "vue-color";
+//#region src/grid/cells/GridColorPickerEditor.vue?vue&type=script&setup=true&lang.ts
+var v = { class: "well-cell-color-hex" };
+typeof window < "u" && import("vue-color/style.css");
+var y = /* @__PURE__ */ i({
+	inheritAttrs: !1,
+	__name: "GridColorPickerEditor",
+	props: {
+		val: {},
+		save: { type: Function },
+		close: { type: Function }
+	},
+	setup(i) {
+		let y = i, b = u(null), x = u(null);
+		function S(e) {
+			let t = _(e);
+			return t.isValid() ? t.toHexString() : "#cccccc";
+		}
+		let C = u(S(y.val));
+		function w(e) {
+			(e.key === "Enter" || e.key === "Escape") && (e.stopPropagation(), x.value?.hide());
+		}
+		s(() => {
+			a(() => {
+				x.value?.show({ currentTarget: b.value }, b.value);
+			}), document.addEventListener("keydown", w, !0);
+		}), c(() => {
+			document.removeEventListener("keydown", w, !0);
+		});
+		function T(e) {
+			let t = S(e);
+			C.value = t, y.save(t, !0);
+		}
+		function E() {
+			y.close();
+		}
+		return (i, a) => (l(), t(e, null, [n("div", {
+			ref_key: "triggerRef",
+			ref: b,
+			class: "well-cell-color-trigger",
+			tabindex: "-1",
+			onKeydown: w
+		}, [n("span", {
+			class: "well-cell-color-swatch",
+			style: o({ backgroundColor: C.value })
+		}, null, 4), n("span", v, d(C.value), 1)], 544), r(f(h), {
+			ref_key: "popoverRef",
+			ref: x,
+			pt: { content: "p-0" },
+			onHide: E
+		}, {
+			default: p(() => [n("div", {
+				onMousedown: a[0] || (a[0] = m(() => {}, ["stop"])),
+				onClick: a[1] || (a[1] = m(() => {}, ["stop"])),
+				onKeydown: w
+			}, [r(f(g), {
+				"model-value": C.value,
+				"disable-alpha": "",
+				"onUpdate:modelValue": T
+			}, null, 8, ["model-value"])], 32)]),
+			_: 1
+		}, 512)], 64));
+	}
+});
+//#endregion
+export { y as default };
+
+//# sourceMappingURL=GridColorPickerEditor.vue_vue_type_script_setup_true_lang.js.map

package/dist/grid/cells/GridColorPickerEditor.vue_vue_type_script_setup_true_lang.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"GridColorPickerEditor.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/grid/cells/GridColorPickerEditor.vue"],"sourcesContent":["<script lang=\"ts\">\n// vue-color's stylesheet is imported dynamically, on the client only. A\n// static `import 'vue-color/style.css'` stays in `dist/` (vue-color is\n// external), so Node would fail to load `@welldot/vue/grid` during plain-Vite\n// SSR unless the app set `ssr.noExternal`. Editors only mount in the browser,\n// and loading at module evaluation means the CSS is there before one opens.\nif (typeof window !== 'undefined') void import('vue-color/style.css');\n</script>\n\n<script setup lang=\"ts\">\nimport Popover from 'primevue/popover';\nimport { SketchPicker, tinycolor } from 'vue-color';\nimport { nextTick, onMounted, onUnmounted, ref } from 'vue';\n\nconst props = defineProps<{\n  val?: unknown;\n  save: (value: unknown, preventFocus?: boolean) => void;\n  close: (focusNext?: boolean) => void;\n}>();\n\ndefineOptions({ inheritAttrs: false });\n\nconst triggerRef = ref<HTMLElement | null>(null);\nconst popoverRef = ref<InstanceType<typeof Popover> | null>(null);\n\n// vue-color echoes back the format of the value it was given (and can drift\n// to HSV objects), so normalize everything to `#rrggbb` on the way in and out.\nfunction toHex(value: unknown): string {\n  const color = tinycolor(value as string);\n  return color.isValid() ? color.toHexString() : '#cccccc';\n}\n\nconst localValue = ref(toHex(props.val));\n\nfunction onKeydown(e: KeyboardEvent) {\n  if (e.key === 'Enter' || e.key === 'Escape') {\n    e.stopPropagation();\n    popoverRef.value?.hide();\n  }\n}\n\nonMounted(() => {\n  nextTick(() => {\n    popoverRef.value?.show(\n      { currentTarget: triggerRef.value } as unknown as Event,\n      triggerRef.value,\n    );\n  });\n  document.addEventListener('keydown', onKeydown, true);\n});\n\nonUnmounted(() => {\n  document.removeEventListener('keydown', onKeydown, true);\n});\n\nfunction onChange(value: unknown) {\n  const hex = toHex(value);\n  localValue.value = hex;\n  props.save(hex, true);\n}\n\nfunction onHide() {\n  props.close();\n}\n</script>\n\n<template>\n  <div\n    ref=\"triggerRef\"\n    class=\"well-cell-color-trigger\"\n    tabindex=\"-1\"\n    @keydown=\"onKeydown\"\n  >\n    <span\n      class=\"well-cell-color-swatch\"\n      :style=\"{ backgroundColor: localValue }\"\n    />\n    <span class=\"well-cell-color-hex\">{{ localValue }}</span>\n  </div>\n\n  <Popover\n    ref=\"popoverRef\"\n    :pt=\"{\n      content: 'p-0',\n    }\"\n    @hide=\"onHide\"\n  >\n    <div @mousedown.stop @click.stop @keydown=\"onKeydown\">\n      <SketchPicker\n        :model-value=\"localValue\"\n        disable-alpha\n        @update:model-value=\"onChange\"\n      />\n    </div>\n  </Popover>\n</template>\n"],"mappings":";;;;;AAMI,OAAO,SAAW,OAAkB,OAAO;;;;;;;;;;EAQ/C,IAAM,IAAQ,GAQR,IAAa,EAAwB,KAAK,EAC1C,IAAa,EAAyC,KAAK;EAIjE,SAAS,EAAM,GAAwB;GACrC,IAAM,IAAQ,EAAU,EAAgB;AACxC,UAAO,EAAM,SAAS,GAAG,EAAM,aAAa,GAAG;;EAGjD,IAAM,IAAa,EAAI,EAAM,EAAM,IAAI,CAAC;EAExC,SAAS,EAAU,GAAkB;AACnC,IAAI,EAAE,QAAQ,WAAW,EAAE,QAAQ,cACjC,EAAE,iBAAiB,EACnB,EAAW,OAAO,MAAM;;AAc5B,EAVA,QAAgB;AAOd,GANA,QAAe;AACb,MAAW,OAAO,KAChB,EAAE,eAAe,EAAW,OAAO,EACnC,EAAW,MACZ;KACD,EACF,SAAS,iBAAiB,WAAW,GAAW,GAAK;IACrD,EAEF,QAAkB;AAChB,YAAS,oBAAoB,WAAW,GAAW,GAAK;IACxD;EAEF,SAAS,EAAS,GAAgB;GAChC,IAAM,IAAM,EAAM,EAAM;AAExB,GADA,EAAW,QAAQ,GACnB,EAAM,KAAK,GAAK,GAAK;;EAGvB,SAAS,IAAS;AAChB,KAAM,OAAO;;qCAKb,EAWM,OAAA;YAVA;GAAJ,KAAI;GACJ,OAAM;GACN,UAAS;GACC;MAEV,EAGE,QAAA;GAFA,OAAM;GACL,OAAK,EAAA,EAAA,iBAAqB,EAAA,OAAU,CAAA;eAEvC,EAAyD,QAAzD,GAAyD,EAApB,EAAA,MAAU,EAAA,EAAA,CAAA,EAAA,IAAA,EAGjD,EAcU,EAAA,EAAA,EAAA;YAbJ;GAAJ,KAAI;GACH,IAAI,EAAA,SAAA,OAEJ;GACM;;oBAQD,CANN,EAMM,OAAA;IANA,aAAS,EAAA,OAAA,EAAA,KAAA,QAAV,IAAe,CAAA,OAAA,CAAA;IAAE,SAAK,EAAA,OAAA,EAAA,KAAA,QAAN,IAAW,CAAA,OAAA,CAAA;IAAW;OACzC,EAIE,EAAA,EAAA,EAAA;IAHC,eAAa,EAAA;IACd,iBAAA;IACC,uBAAoB"}

package/dist/grid/cells/GridComboEditor.d.ts

@@ -0,0 +1,14 @@
+import { LanguageTextInput } from '@welldot/core';
+import { ResolvedGridOption } from '../types';
+type __VLS_Props = {
+    val?: unknown;
+    save: (value: unknown, preventFocus?: boolean) => void;
+    close: (focusNext?: boolean) => void;
+    options: ResolvedGridOption[];
+    /** Note atop the suggestions saying free text is accepted. */
+    hint?: LanguageTextInput;
+};
+declare const __VLS_export: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;
+//# sourceMappingURL=GridComboEditor.vue.d.ts.map

package/dist/grid/cells/GridComboEditor.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"GridComboEditor.d.ts","sourceRoot":"","sources":["../../../src/grid/cells/GridComboEditor.vue"],"names":[],"mappings":"AAqSA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,eAAe,CAAC;AAKvD,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,UAAU,CAAC;AAEnD,KAAK,WAAW,GAAG;IACjB,GAAG,CAAC,EAAE,OAAO,CAAC;IACd,IAAI,EAAE,CAAC,KAAK,EAAE,OAAO,EAAE,YAAY,CAAC,EAAE,OAAO,KAAK,IAAI,CAAC;IACvD,KAAK,EAAE,CAAC,SAAS,CAAC,EAAE,OAAO,KAAK,IAAI,CAAC;IACrC,OAAO,EAAE,kBAAkB,EAAE,CAAC;IAC9B,8DAA8D;IAC9D,IAAI,CAAC,EAAE,iBAAiB,CAAC;CAC1B,CAAC;AAqVF,QAAA,MAAM,YAAY,kSAEhB,CAAC;wBACkB,OAAO,YAAY;AAAxC,wBAAyC"}

package/dist/grid/cells/GridComboEditor.js

@@ -0,0 +1,7 @@
+import e from "./GridComboEditor.vue_vue_type_script_setup_true_lang.js";
+//#region src/grid/cells/GridComboEditor.vue
+var t = e;
+//#endregion
+export { t as default };
+
+//# sourceMappingURL=GridComboEditor.js.map

package/dist/grid/cells/GridComboEditor.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"GridComboEditor.js","names":[],"sources":["../../../src/grid/cells/GridComboEditor.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport {\n  computed,\n  nextTick,\n  onBeforeUnmount,\n  onMounted,\n  ref,\n  useId,\n  watch,\n} from 'vue';\nimport type { LanguageTextInput } from '@welldot/core';\nimport IconCaretDown from '~icons/ph/caret-down';\nimport IconPencilSimpleLine from '~icons/ph/pencil-simple-line';\nimport { useWellText } from '../../composables/useWellText';\nimport { useGridOverlayFocusGuard } from '../composables/useGridOverlayFocusGuard';\nimport type { ResolvedGridOption } from '../types';\n\nconst props = defineProps<{\n  val?: unknown;\n  save: (value: unknown, preventFocus?: boolean) => void;\n  close: (focusNext?: boolean) => void;\n  options: ResolvedGridOption[];\n  /** Note atop the suggestions saying free text is accepted. */\n  hint?: LanguageTextInput;\n}>();\n\ndefineOptions({ inheritAttrs: false });\n\nconst MAX_LENGTH = 90;\nconst PANEL_MAX_HEIGHT = 240;\n\nconst listId = `well-combo-${useId()}`;\nconst hintId = `${listId}-hint`;\nconst resolveText = useWellText();\nconst hintText = computed(() => resolveText(props.hint));\nconst rootRef = ref<HTMLElement | null>(null);\nconst inputRef = ref<HTMLInputElement | null>(null);\nconst panelRef = ref<HTMLElement | null>(null);\nconst overlayFocusGuard = useGridOverlayFocusGuard();\n\nconst normalize = (s: string) =>\n  s\n    .normalize('NFD')\n    .replace(/\\p{Diacritic}/gu, '')\n    .toLowerCase()\n    .trim();\n\nfunction findOption(text: string) {\n  const needle = normalize(text);\n  if (!needle) return undefined;\n  return props.options.find(\n    o => normalize(o.label) === needle || normalize(o.value) === needle,\n  );\n}\n\n// Show the option's label for canonical values, the raw text otherwise —\n// the same display rule PrimeVue's editable Select applied.\nconst rawVal = typeof props.val === 'string' ? props.val : '';\nconst initialText =\n  props.options.find(o => o.value === rawVal)?.label ?? rawVal;\n\n// Deprecated entries still resolve typed text, but aren't suggested.\nconst suggestions = computed(() =>\n  props.options.filter(o => !o.deprecated || o.value === rawVal),\n);\n\nconst text = ref(initialText);\nconst open = ref(true);\nconst activeIndex = ref(-1);\nconst panelStyle = ref<Record<string, string>>({});\nlet committed = false;\n\n// Until the user edits, the input holds the current value — filtering by it\n// would hide every other suggestion, so list them all.\nconst filtered = computed(() => {\n  const needle = normalize(text.value);\n  if (!needle || text.value === initialText) return suggestions.value;\n  return suggestions.value.filter(\n    o =>\n      normalize(o.label).includes(needle) ||\n      normalize(o.value).includes(needle),\n  );\n});\n\nconst selectedValue = computed(() => findOption(text.value)?.value);\nconst panelVisible = computed(() => open.value && filtered.value.length > 0);\n\nwatch(filtered, () => {\n  activeIndex.value = -1;\n});\n\nfunction commit(value: string, preventFocus = true) {\n  if (committed) return;\n  committed = true;\n  const trimmed = value.trim();\n  props.save(findOption(trimmed)?.value ?? trimmed, preventFocus);\n}\n\nfunction pick(option: ResolvedGridOption) {\n  text.value = option.label;\n  commit(option.label);\n  props.close();\n}\n\nfunction updatePosition() {\n  const el = rootRef.value;\n  if (!el) return;\n  const rect = el.getBoundingClientRect();\n  const spaceBelow = window.innerHeight - rect.bottom;\n  const flip = spaceBelow < PANEL_MAX_HEIGHT && rect.top > spaceBelow;\n  panelStyle.value = {\n    left: `${rect.left}px`,\n    minWidth: `${rect.width}px`,\n    ...(flip\n      ? { bottom: `${window.innerHeight - rect.top + 2}px` }\n      : { top: `${rect.bottom + 2}px` }),\n  };\n}\n\nfunction scrollActiveIntoView() {\n  nextTick(() => {\n    panelRef.value\n      ?.querySelector<HTMLElement>(`[data-index=\"${activeIndex.value}\"]`)\n      ?.scrollIntoView({ block: 'nearest' });\n  });\n}\n\nfunction moveActive(delta: number) {\n  if (!open.value) {\n    open.value = true;\n    return;\n  }\n  const count = filtered.value.length;\n  if (!count) return;\n  activeIndex.value = (activeIndex.value + delta + count) % count;\n  scrollActiveIntoView();\n}\n\nfunction onInput(e: Event) {\n  text.value = (e.target as HTMLInputElement).value;\n  open.value = true;\n}\n\nfunction onKeydown(e: KeyboardEvent) {\n  switch (e.key) {\n    case 'ArrowDown':\n      e.preventDefault();\n      e.stopPropagation();\n      moveActive(1);\n      break;\n    case 'ArrowUp':\n      e.preventDefault();\n      e.stopPropagation();\n      moveActive(-1);\n      break;\n    case 'Enter': {\n      e.preventDefault();\n      e.stopPropagation();\n      const option = panelVisible.value\n        ? filtered.value[activeIndex.value]\n        : undefined;\n      if (option) text.value = option.label;\n      commit(text.value, false);\n      break;\n    }\n    case 'Tab':\n      commit(text.value);\n      break;\n    case 'Escape':\n      e.stopPropagation();\n      if (panelVisible.value) {\n        open.value = false;\n      } else {\n        committed = true;\n        props.close();\n      }\n      break;\n  }\n}\n\nfunction onBlur() {\n  commit(text.value);\n}\n\nfunction togglePanel() {\n  open.value = !open.value;\n  inputRef.value?.focus();\n}\n\nwatch(panelVisible, visible => {\n  if (visible) nextTick(updatePosition);\n});\n\nonMounted(() => {\n  updatePosition();\n  window.addEventListener('scroll', updatePosition, true);\n  window.addEventListener('resize', updatePosition);\n  nextTick(() => {\n    inputRef.value?.focus();\n    inputRef.value?.select();\n  });\n});\n\nonBeforeUnmount(() => {\n  window.removeEventListener('scroll', updatePosition, true);\n  window.removeEventListener('resize', updatePosition);\n});\n</script>\n\n<template>\n  <div ref=\"rootRef\" class=\"well-cell-combo\">\n    <input\n      ref=\"inputRef\"\n      :value=\"text\"\n      :maxlength=\"MAX_LENGTH\"\n      class=\"well-cell-combo-input\"\n      type=\"text\"\n      role=\"combobox\"\n      autocomplete=\"off\"\n      aria-autocomplete=\"list\"\n      :aria-expanded=\"panelVisible\"\n      :aria-controls=\"listId\"\n      :aria-describedby=\"panelVisible && hintText ? hintId : undefined\"\n      :aria-activedescendant=\"\n        activeIndex >= 0 ? `${listId}-${activeIndex}` : undefined\n      \"\n      @input=\"onInput\"\n      @keydown=\"onKeydown\"\n      @blur=\"onBlur\"\n    />\n    <button\n      type=\"button\"\n      tabindex=\"-1\"\n      class=\"well-cell-combo-toggle\"\n      aria-hidden=\"true\"\n      @mousedown.prevent=\"togglePanel\"\n    >\n      <IconCaretDown class=\"size-3.5\" />\n    </button>\n\n    <Teleport to=\"body\">\n      <ul\n        v-if=\"panelVisible\"\n        :id=\"listId\"\n        ref=\"panelRef\"\n        role=\"listbox\"\n        class=\"well-combo-panel\"\n        :style=\"panelStyle\"\n        v-bind=\"overlayFocusGuard\"\n        @mousedown.prevent\n      >\n        <li\n          v-if=\"hintText\"\n          :id=\"hintId\"\n          role=\"presentation\"\n          class=\"well-combo-hint\"\n        >\n          <IconPencilSimpleLine class=\"size-3.5 shrink-0\" aria-hidden=\"true\" />\n          {{ hintText }}\n        </li>\n        <li\n          v-for=\"(option, i) in filtered\"\n          :id=\"`${listId}-${i}`\"\n          :key=\"option.value\"\n          :data-index=\"i\"\n          role=\"option\"\n          :aria-selected=\"option.value === selectedValue\"\n          class=\"well-combo-option text-sm p-1\"\n          :class=\"{\n            'is-active': i === activeIndex,\n            'is-selected': option.value === selectedValue,\n          }\"\n          @mouseenter=\"activeIndex = i\"\n          @click=\"pick(option)\"\n        >\n          {{ option.label }}\n        </li>\n      </ul>\n    </Teleport>\n  </div>\n</template>\n"],"mappings":""}

package/dist/grid/cells/GridComboEditor.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,177 @@
+import { useWellText as e } from "../../composables/useWellText.js";
+import t from "../../_virtual/icons/ph/pencil-simple-line.js";
+import n from "../../_virtual/icons/ph/caret-down.js";
+import { useGridOverlayFocusGuard as r } from "../composables/useGridOverlayFocusGuard.js";
+import { Fragment as ee, Teleport as te, computed as i, createBlock as a, createCommentVNode as o, createElementBlock as s, createElementVNode as c, createTextVNode as l, createVNode as u, defineComponent as d, mergeProps as f, nextTick as p, normalizeClass as m, onBeforeUnmount as h, onMounted as g, openBlock as _, ref as v, renderList as y, toDisplayString as b, unref as x, useId as S, watch as C, withModifiers as w } from "vue";
+//#region src/grid/cells/GridComboEditor.vue?vue&type=script&setup=true&lang.ts
+var T = [
+	"value",
+	"aria-expanded",
+	"aria-describedby",
+	"aria-activedescendant"
+], E = [
+	"id",
+	"data-index",
+	"aria-selected",
+	"onMouseenter",
+	"onClick"
+], D = 90, O = 240, k = /* @__PURE__ */ d({
+	inheritAttrs: !1,
+	__name: "GridComboEditor",
+	props: {
+		val: {},
+		save: { type: Function },
+		close: { type: Function },
+		options: {},
+		hint: {}
+	},
+	setup(d) {
+		let k = d, A = `well-combo-${S()}`, j = `${A}-hint`, M = e(), N = i(() => M(k.hint)), P = v(null), F = v(null), I = v(null), L = r(), R = (e) => e.normalize("NFD").replace(/\p{Diacritic}/gu, "").toLowerCase().trim();
+		function z(e) {
+			let t = R(e);
+			if (t) return k.options.find((e) => R(e.label) === t || R(e.value) === t);
+		}
+		let B = typeof k.val == "string" ? k.val : "", V = k.options.find((e) => e.value === B)?.label ?? B, H = i(() => k.options.filter((e) => !e.deprecated || e.value === B)), U = v(V), W = v(!0), G = v(-1), K = v({}), q = !1, J = i(() => {
+			let e = R(U.value);
+			return !e || U.value === V ? H.value : H.value.filter((t) => R(t.label).includes(e) || R(t.value).includes(e));
+		}), Y = i(() => z(U.value)?.value), X = i(() => W.value && J.value.length > 0);
+		C(J, () => {
+			G.value = -1;
+		});
+		function Z(e, t = !0) {
+			if (q) return;
+			q = !0;
+			let n = e.trim();
+			k.save(z(n)?.value ?? n, t);
+		}
+		function ne(e) {
+			U.value = e.label, Z(e.label), k.close();
+		}
+		function Q() {
+			let e = P.value;
+			if (!e) return;
+			let t = e.getBoundingClientRect(), n = window.innerHeight - t.bottom, r = n < O && t.top > n;
+			K.value = {
+				left: `${t.left}px`,
+				minWidth: `${t.width}px`,
+				...r ? { bottom: `${window.innerHeight - t.top + 2}px` } : { top: `${t.bottom + 2}px` }
+			};
+		}
+		function re() {
+			p(() => {
+				I.value?.querySelector(`[data-index="${G.value}"]`)?.scrollIntoView({ block: "nearest" });
+			});
+		}
+		function $(e) {
+			if (!W.value) {
+				W.value = !0;
+				return;
+			}
+			let t = J.value.length;
+			t && (G.value = (G.value + e + t) % t, re());
+		}
+		function ie(e) {
+			U.value = e.target.value, W.value = !0;
+		}
+		function ae(e) {
+			switch (e.key) {
+				case "ArrowDown":
+					e.preventDefault(), e.stopPropagation(), $(1);
+					break;
+				case "ArrowUp":
+					e.preventDefault(), e.stopPropagation(), $(-1);
+					break;
+				case "Enter": {
+					e.preventDefault(), e.stopPropagation();
+					let t = X.value ? J.value[G.value] : void 0;
+					t && (U.value = t.label), Z(U.value, !1);
+					break;
+				}
+				case "Tab":
+					Z(U.value);
+					break;
+				case "Escape":
+					e.stopPropagation(), X.value ? W.value = !1 : (q = !0, k.close());
+					break;
+			}
+		}
+		function oe() {
+			Z(U.value);
+		}
+		function se() {
+			W.value = !W.value, F.value?.focus();
+		}
+		return C(X, (e) => {
+			e && p(Q);
+		}), g(() => {
+			Q(), window.addEventListener("scroll", Q, !0), window.addEventListener("resize", Q), p(() => {
+				F.value?.focus(), F.value?.select();
+			});
+		}), h(() => {
+			window.removeEventListener("scroll", Q, !0), window.removeEventListener("resize", Q);
+		}), (e, r) => (_(), s("div", {
+			ref_key: "rootRef",
+			ref: P,
+			class: "well-cell-combo"
+		}, [
+			c("input", {
+				ref_key: "inputRef",
+				ref: F,
+				value: U.value,
+				maxlength: D,
+				class: "well-cell-combo-input",
+				type: "text",
+				role: "combobox",
+				autocomplete: "off",
+				"aria-autocomplete": "list",
+				"aria-expanded": X.value,
+				"aria-controls": A,
+				"aria-describedby": X.value && N.value ? j : void 0,
+				"aria-activedescendant": G.value >= 0 ? `${A}-${G.value}` : void 0,
+				onInput: ie,
+				onKeydown: ae,
+				onBlur: oe
+			}, null, 40, T),
+			c("button", {
+				type: "button",
+				tabindex: "-1",
+				class: "well-cell-combo-toggle",
+				"aria-hidden": "true",
+				onMousedown: w(se, ["prevent"])
+			}, [u(x(n), { class: "size-3.5" })], 32),
+			(_(), a(te, { to: "body" }, [X.value ? (_(), s("ul", f({
+				key: 0,
+				id: A,
+				ref_key: "panelRef",
+				ref: I,
+				role: "listbox",
+				class: "well-combo-panel",
+				style: K.value
+			}, x(L), { onMousedown: r[0] || (r[0] = w(() => {}, ["prevent"])) }), [N.value ? (_(), s("li", {
+				key: 0,
+				id: j,
+				role: "presentation",
+				class: "well-combo-hint"
+			}, [u(x(t), {
+				class: "size-3.5 shrink-0",
+				"aria-hidden": "true"
+			}), l(" " + b(N.value), 1)])) : o("", !0), (_(!0), s(ee, null, y(J.value, (e, t) => (_(), s("li", {
+				id: `${A}-${t}`,
+				key: e.value,
+				"data-index": t,
+				role: "option",
+				"aria-selected": e.value === Y.value,
+				class: m(["well-combo-option text-sm p-1", {
+					"is-active": t === G.value,
+					"is-selected": e.value === Y.value
+				}]),
+				onMouseenter: (e) => G.value = t,
+				onClick: (t) => ne(e)
+			}, b(e.label), 43, E))), 128))], 16)) : o("", !0)]))
+		], 512));
+	}
+});
+//#endregion
+export { k as default };
+
+//# sourceMappingURL=GridComboEditor.vue_vue_type_script_setup_true_lang.js.map

package/dist/grid/cells/GridComboEditor.vue_vue_type_script_setup_true_lang.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"GridComboEditor.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/grid/cells/GridComboEditor.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport {\n  computed,\n  nextTick,\n  onBeforeUnmount,\n  onMounted,\n  ref,\n  useId,\n  watch,\n} from 'vue';\nimport type { LanguageTextInput } from '@welldot/core';\nimport IconCaretDown from '~icons/ph/caret-down';\nimport IconPencilSimpleLine from '~icons/ph/pencil-simple-line';\nimport { useWellText } from '../../composables/useWellText';\nimport { useGridOverlayFocusGuard } from '../composables/useGridOverlayFocusGuard';\nimport type { ResolvedGridOption } from '../types';\n\nconst props = defineProps<{\n  val?: unknown;\n  save: (value: unknown, preventFocus?: boolean) => void;\n  close: (focusNext?: boolean) => void;\n  options: ResolvedGridOption[];\n  /** Note atop the suggestions saying free text is accepted. */\n  hint?: LanguageTextInput;\n}>();\n\ndefineOptions({ inheritAttrs: false });\n\nconst MAX_LENGTH = 90;\nconst PANEL_MAX_HEIGHT = 240;\n\nconst listId = `well-combo-${useId()}`;\nconst hintId = `${listId}-hint`;\nconst resolveText = useWellText();\nconst hintText = computed(() => resolveText(props.hint));\nconst rootRef = ref<HTMLElement | null>(null);\nconst inputRef = ref<HTMLInputElement | null>(null);\nconst panelRef = ref<HTMLElement | null>(null);\nconst overlayFocusGuard = useGridOverlayFocusGuard();\n\nconst normalize = (s: string) =>\n  s\n    .normalize('NFD')\n    .replace(/\\p{Diacritic}/gu, '')\n    .toLowerCase()\n    .trim();\n\nfunction findOption(text: string) {\n  const needle = normalize(text);\n  if (!needle) return undefined;\n  return props.options.find(\n    o => normalize(o.label) === needle || normalize(o.value) === needle,\n  );\n}\n\n// Show the option's label for canonical values, the raw text otherwise —\n// the same display rule PrimeVue's editable Select applied.\nconst rawVal = typeof props.val === 'string' ? props.val : '';\nconst initialText =\n  props.options.find(o => o.value === rawVal)?.label ?? rawVal;\n\n// Deprecated entries still resolve typed text, but aren't suggested.\nconst suggestions = computed(() =>\n  props.options.filter(o => !o.deprecated || o.value === rawVal),\n);\n\nconst text = ref(initialText);\nconst open = ref(true);\nconst activeIndex = ref(-1);\nconst panelStyle = ref<Record<string, string>>({});\nlet committed = false;\n\n// Until the user edits, the input holds the current value — filtering by it\n// would hide every other suggestion, so list them all.\nconst filtered = computed(() => {\n  const needle = normalize(text.value);\n  if (!needle || text.value === initialText) return suggestions.value;\n  return suggestions.value.filter(\n    o =>\n      normalize(o.label).includes(needle) ||\n      normalize(o.value).includes(needle),\n  );\n});\n\nconst selectedValue = computed(() => findOption(text.value)?.value);\nconst panelVisible = computed(() => open.value && filtered.value.length > 0);\n\nwatch(filtered, () => {\n  activeIndex.value = -1;\n});\n\nfunction commit(value: string, preventFocus = true) {\n  if (committed) return;\n  committed = true;\n  const trimmed = value.trim();\n  props.save(findOption(trimmed)?.value ?? trimmed, preventFocus);\n}\n\nfunction pick(option: ResolvedGridOption) {\n  text.value = option.label;\n  commit(option.label);\n  props.close();\n}\n\nfunction updatePosition() {\n  const el = rootRef.value;\n  if (!el) return;\n  const rect = el.getBoundingClientRect();\n  const spaceBelow = window.innerHeight - rect.bottom;\n  const flip = spaceBelow < PANEL_MAX_HEIGHT && rect.top > spaceBelow;\n  panelStyle.value = {\n    left: `${rect.left}px`,\n    minWidth: `${rect.width}px`,\n    ...(flip\n      ? { bottom: `${window.innerHeight - rect.top + 2}px` }\n      : { top: `${rect.bottom + 2}px` }),\n  };\n}\n\nfunction scrollActiveIntoView() {\n  nextTick(() => {\n    panelRef.value\n      ?.querySelector<HTMLElement>(`[data-index=\"${activeIndex.value}\"]`)\n      ?.scrollIntoView({ block: 'nearest' });\n  });\n}\n\nfunction moveActive(delta: number) {\n  if (!open.value) {\n    open.value = true;\n    return;\n  }\n  const count = filtered.value.length;\n  if (!count) return;\n  activeIndex.value = (activeIndex.value + delta + count) % count;\n  scrollActiveIntoView();\n}\n\nfunction onInput(e: Event) {\n  text.value = (e.target as HTMLInputElement).value;\n  open.value = true;\n}\n\nfunction onKeydown(e: KeyboardEvent) {\n  switch (e.key) {\n    case 'ArrowDown':\n      e.preventDefault();\n      e.stopPropagation();\n      moveActive(1);\n      break;\n    case 'ArrowUp':\n      e.preventDefault();\n      e.stopPropagation();\n      moveActive(-1);\n      break;\n    case 'Enter': {\n      e.preventDefault();\n      e.stopPropagation();\n      const option = panelVisible.value\n        ? filtered.value[activeIndex.value]\n        : undefined;\n      if (option) text.value = option.label;\n      commit(text.value, false);\n      break;\n    }\n    case 'Tab':\n      commit(text.value);\n      break;\n    case 'Escape':\n      e.stopPropagation();\n      if (panelVisible.value) {\n        open.value = false;\n      } else {\n        committed = true;\n        props.close();\n      }\n      break;\n  }\n}\n\nfunction onBlur() {\n  commit(text.value);\n}\n\nfunction togglePanel() {\n  open.value = !open.value;\n  inputRef.value?.focus();\n}\n\nwatch(panelVisible, visible => {\n  if (visible) nextTick(updatePosition);\n});\n\nonMounted(() => {\n  updatePosition();\n  window.addEventListener('scroll', updatePosition, true);\n  window.addEventListener('resize', updatePosition);\n  nextTick(() => {\n    inputRef.value?.focus();\n    inputRef.value?.select();\n  });\n});\n\nonBeforeUnmount(() => {\n  window.removeEventListener('scroll', updatePosition, true);\n  window.removeEventListener('resize', updatePosition);\n});\n</script>\n\n<template>\n  <div ref=\"rootRef\" class=\"well-cell-combo\">\n    <input\n      ref=\"inputRef\"\n      :value=\"text\"\n      :maxlength=\"MAX_LENGTH\"\n      class=\"well-cell-combo-input\"\n      type=\"text\"\n      role=\"combobox\"\n      autocomplete=\"off\"\n      aria-autocomplete=\"list\"\n      :aria-expanded=\"panelVisible\"\n      :aria-controls=\"listId\"\n      :aria-describedby=\"panelVisible && hintText ? hintId : undefined\"\n      :aria-activedescendant=\"\n        activeIndex >= 0 ? `${listId}-${activeIndex}` : undefined\n      \"\n      @input=\"onInput\"\n      @keydown=\"onKeydown\"\n      @blur=\"onBlur\"\n    />\n    <button\n      type=\"button\"\n      tabindex=\"-1\"\n      class=\"well-cell-combo-toggle\"\n      aria-hidden=\"true\"\n      @mousedown.prevent=\"togglePanel\"\n    >\n      <IconCaretDown class=\"size-3.5\" />\n    </button>\n\n    <Teleport to=\"body\">\n      <ul\n        v-if=\"panelVisible\"\n        :id=\"listId\"\n        ref=\"panelRef\"\n        role=\"listbox\"\n        class=\"well-combo-panel\"\n        :style=\"panelStyle\"\n        v-bind=\"overlayFocusGuard\"\n        @mousedown.prevent\n      >\n        <li\n          v-if=\"hintText\"\n          :id=\"hintId\"\n          role=\"presentation\"\n          class=\"well-combo-hint\"\n        >\n          <IconPencilSimpleLine class=\"size-3.5 shrink-0\" aria-hidden=\"true\" />\n          {{ hintText }}\n        </li>\n        <li\n          v-for=\"(option, i) in filtered\"\n          :id=\"`${listId}-${i}`\"\n          :key=\"option.value\"\n          :data-index=\"i\"\n          role=\"option\"\n          :aria-selected=\"option.value === selectedValue\"\n          class=\"well-combo-option text-sm p-1\"\n          :class=\"{\n            'is-active': i === activeIndex,\n            'is-selected': option.value === selectedValue,\n          }\"\n          @mouseenter=\"activeIndex = i\"\n          @click=\"pick(option)\"\n        >\n          {{ option.label }}\n        </li>\n      </ul>\n    </Teleport>\n  </div>\n</template>\n"],"mappings":"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"}

package/dist/grid/cells/GridDeleteCell.d.ts

@@ -0,0 +1,12 @@
+import { Component } from 'vue';
+type __VLS_Props = {
+    rowIndex: number;
+    model: Record<string, unknown>;
+    part: Component;
+    label?: string;
+    requestDelete: (rowIndex: number, model: Record<string, unknown>) => void;
+};
+declare const __VLS_export: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;
+//# sourceMappingURL=GridDeleteCell.vue.d.ts.map

package/dist/grid/cells/GridDeleteCell.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"GridDeleteCell.d.ts","sourceRoot":"","sources":["../../../src/grid/cells/GridDeleteCell.vue"],"names":[],"mappings":"AAsCA;;;;GAIG;AACH,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,KAAK,CAAC;AAErC,KAAK,WAAW,GAAG;IACjB,QAAQ,EAAE,MAAM,CAAC;IACjB,KAAK,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IAC/B,IAAI,EAAE,SAAS,CAAC;IAChB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,aAAa,EAAE,CAAC,QAAQ,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,KAAK,IAAI,CAAC;CAC3E,CAAC;AA6CF,QAAA,MAAM,YAAY,kSAEhB,CAAC;wBACkB,OAAO,YAAY;AAAxC,wBAAyC"}

package/dist/grid/cells/GridDeleteCell.js

@@ -0,0 +1,7 @@
+import e from "./GridDeleteCell.vue_vue_type_script_setup_true_lang.js";
+//#region src/grid/cells/GridDeleteCell.vue
+var t = e;
+//#endregion
+export { t as default };
+
+//# sourceMappingURL=GridDeleteCell.js.map

package/dist/grid/cells/GridDeleteCell.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"GridDeleteCell.js","names":[],"sources":["../../../src/grid/cells/GridDeleteCell.vue"],"sourcesContent":["<script setup lang=\"ts\">\n/**\n * Delete column cell: renders the `deleteButton` part (resolved by the\n * column builder) with the `WellDeleteButtonProps` contract and asks the grid\n * to delete the row on its `click`.\n */\nimport type { Component } from 'vue';\n\nconst props = defineProps<{\n  rowIndex: number;\n  model: Record<string, unknown>;\n  part: Component;\n  label?: string;\n  requestDelete: (rowIndex: number, model: Record<string, unknown>) => void;\n}>();\n\ndefineOptions({ inheritAttrs: false });\n\nfunction handleClick(e?: unknown) {\n  // A native click (default part, or a part whose root gets the listener)\n  // must not reach the grid, which would treat it as a cell click.\n  if (e instanceof Event) e.stopPropagation();\n  props.requestDelete(props.rowIndex, props.model);\n}\n</script>\n\n<template>\n  <component\n    :is=\"part\"\n    :index=\"rowIndex\"\n    :row=\"model\"\n    :label=\"label\"\n    @click=\"handleClick\"\n  />\n</template>\n"],"mappings":""}

package/dist/grid/cells/GridDeleteCell.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,33 @@
+import { createBlock as e, defineComponent as t, openBlock as n, resolveDynamicComponent as r } from "vue";
+//#region src/grid/cells/GridDeleteCell.vue?vue&type=script&setup=true&lang.ts
+var i = /* @__PURE__ */ t({
+	inheritAttrs: !1,
+	__name: "GridDeleteCell",
+	props: {
+		rowIndex: {},
+		model: {},
+		part: {},
+		label: {},
+		requestDelete: { type: Function }
+	},
+	setup(t) {
+		let i = t;
+		function a(e) {
+			e instanceof Event && e.stopPropagation(), i.requestDelete(i.rowIndex, i.model);
+		}
+		return (i, o) => (n(), e(r(t.part), {
+			index: t.rowIndex,
+			row: t.model,
+			label: t.label,
+			onClick: a
+		}, null, 8, [
+			"index",
+			"row",
+			"label"
+		]));
+	}
+});
+//#endregion
+export { i as default };
+
+//# sourceMappingURL=GridDeleteCell.vue_vue_type_script_setup_true_lang.js.map

package/dist/grid/cells/GridDeleteCell.vue_vue_type_script_setup_true_lang.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"GridDeleteCell.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/grid/cells/GridDeleteCell.vue"],"sourcesContent":["<script setup lang=\"ts\">\n/**\n * Delete column cell: renders the `deleteButton` part (resolved by the\n * column builder) with the `WellDeleteButtonProps` contract and asks the grid\n * to delete the row on its `click`.\n */\nimport type { Component } from 'vue';\n\nconst props = defineProps<{\n  rowIndex: number;\n  model: Record<string, unknown>;\n  part: Component;\n  label?: string;\n  requestDelete: (rowIndex: number, model: Record<string, unknown>) => void;\n}>();\n\ndefineOptions({ inheritAttrs: false });\n\nfunction handleClick(e?: unknown) {\n  // A native click (default part, or a part whose root gets the listener)\n  // must not reach the grid, which would treat it as a cell click.\n  if (e instanceof Event) e.stopPropagation();\n  props.requestDelete(props.rowIndex, props.model);\n}\n</script>\n\n<template>\n  <component\n    :is=\"part\"\n    :index=\"rowIndex\"\n    :row=\"model\"\n    :label=\"label\"\n    @click=\"handleClick\"\n  />\n</template>\n"],"mappings":";;;;;;;;;;;;;EAQA,IAAM,IAAQ;EAUd,SAAS,EAAY,GAAa;AAIhC,GADI,aAAa,SAAO,EAAE,iBAAiB,EAC3C,EAAM,cAAc,EAAM,UAAU,EAAM,MAAM;;yBAKhD,EAME,EALK,EAAA,KAAI,EAAA;GACR,OAAO,EAAA;GACP,KAAK,EAAA;GACL,OAAO,EAAA;GACP,SAAO"}

package/dist/grid/cells/GridDragCell.d.ts

@@ -0,0 +1,16 @@
+import { Component } from 'vue';
+type __VLS_Props = {
+    part: Component;
+    prop?: unknown;
+    model?: Record<string, unknown>;
+    column?: unknown;
+    rowIndex?: number;
+    colIndex?: number;
+    colType?: unknown;
+    type?: unknown;
+    data?: unknown;
+};
+declare const __VLS_export: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;
+//# sourceMappingURL=GridDragCell.vue.d.ts.map

package/dist/grid/cells/GridDragCell.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"GridDragCell.d.ts","sourceRoot":"","sources":["../../../src/grid/cells/GridDragCell.vue"],"names":[],"mappings":"AA0DA;;;;;;GAMG;AACH,OAAO,EAAO,KAAK,SAAS,EAAE,MAAM,KAAK,CAAC;AAE1C,KAAK,WAAW,GAAG;IACjB,IAAI,EAAE,SAAS,CAAC;IAChB,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IAChC,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,IAAI,CAAC,EAAE,OAAO,CAAC;CAChB,CAAC;AAyDF,QAAA,MAAM,YAAY,kSAEhB,CAAC;wBACkB,OAAO,YAAY;AAAxC,wBAAyC"}

package/dist/grid/cells/GridDragCell.js

@@ -0,0 +1,7 @@
+import e from "./GridDragCell.vue_vue_type_script_setup_true_lang.js";
+//#region src/grid/cells/GridDragCell.vue
+var t = e;
+//#endregion
+export { t as default };
+
+//# sourceMappingURL=GridDragCell.js.map

package/dist/grid/cells/GridDragCell.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"GridDragCell.js","names":[],"sources":["../../../src/grid/cells/GridDragCell.vue"],"sourcesContent":["<script setup lang=\"ts\">\n/**\n * Drag column cell, used only when a `dragHandle` part is given. A column\n * `cellTemplate` replaces RevoGrid's built-in handle, so this re-creates it:\n * the same `.revo-draggable` wrapper, and on mousedown the same bubbling\n * `dragstartcell` event the built-in handle emits (RevoGrid's row-order\n * editor only reads `originalEvent` from it).\n */\nimport { ref, type Component } from 'vue';\n\nconst props = defineProps<{\n  part: Component;\n  prop?: unknown;\n  model?: Record<string, unknown>;\n  column?: unknown;\n  rowIndex?: number;\n  colIndex?: number;\n  colType?: unknown;\n  type?: unknown;\n  data?: unknown;\n}>();\n\ndefineOptions({ inheritAttrs: false });\n\nconst root = ref<HTMLElement | null>(null);\n\nfunction onMousedown(originalEvent: MouseEvent) {\n  root.value?.dispatchEvent(\n    new CustomEvent('dragstartcell', {\n      bubbles: true,\n      cancelable: true,\n      composed: true,\n      detail: {\n        originalEvent,\n        model: {\n          prop: props.prop,\n          model: props.model,\n          column: props.column,\n          rowIndex: props.rowIndex,\n          colIndex: props.colIndex,\n          colType: props.colType,\n          type: props.type,\n          data: props.data,\n        },\n      },\n    }),\n  );\n}\n</script>\n\n<template>\n  <span ref=\"root\" class=\"revo-draggable\" @mousedown=\"onMousedown\">\n    <component :is=\"part\" />\n  </span>\n</template>\n"],"mappings":""}

package/dist/grid/cells/GridDragCell.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,50 @@
+import { createBlock as e, createElementBlock as t, defineComponent as n, openBlock as r, ref as i, resolveDynamicComponent as a } from "vue";
+//#region src/grid/cells/GridDragCell.vue?vue&type=script&setup=true&lang.ts
+var o = /* @__PURE__ */ n({
+	inheritAttrs: !1,
+	__name: "GridDragCell",
+	props: {
+		part: {},
+		prop: {},
+		model: {},
+		column: {},
+		rowIndex: {},
+		colIndex: {},
+		colType: {},
+		type: {},
+		data: {}
+	},
+	setup(n) {
+		let o = n, s = i(null);
+		function c(e) {
+			s.value?.dispatchEvent(new CustomEvent("dragstartcell", {
+				bubbles: !0,
+				cancelable: !0,
+				composed: !0,
+				detail: {
+					originalEvent: e,
+					model: {
+						prop: o.prop,
+						model: o.model,
+						column: o.column,
+						rowIndex: o.rowIndex,
+						colIndex: o.colIndex,
+						colType: o.colType,
+						type: o.type,
+						data: o.data
+					}
+				}
+			}));
+		}
+		return (i, o) => (r(), t("span", {
+			ref_key: "root",
+			ref: s,
+			class: "revo-draggable",
+			onMousedown: c
+		}, [(r(), e(a(n.part)))], 544));
+	}
+});
+//#endregion
+export { o as default };
+
+//# sourceMappingURL=GridDragCell.vue_vue_type_script_setup_true_lang.js.map

package/dist/grid/cells/GridDragCell.vue_vue_type_script_setup_true_lang.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"GridDragCell.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/grid/cells/GridDragCell.vue"],"sourcesContent":["<script setup lang=\"ts\">\n/**\n * Drag column cell, used only when a `dragHandle` part is given. A column\n * `cellTemplate` replaces RevoGrid's built-in handle, so this re-creates it:\n * the same `.revo-draggable` wrapper, and on mousedown the same bubbling\n * `dragstartcell` event the built-in handle emits (RevoGrid's row-order\n * editor only reads `originalEvent` from it).\n */\nimport { ref, type Component } from 'vue';\n\nconst props = defineProps<{\n  part: Component;\n  prop?: unknown;\n  model?: Record<string, unknown>;\n  column?: unknown;\n  rowIndex?: number;\n  colIndex?: number;\n  colType?: unknown;\n  type?: unknown;\n  data?: unknown;\n}>();\n\ndefineOptions({ inheritAttrs: false });\n\nconst root = ref<HTMLElement | null>(null);\n\nfunction onMousedown(originalEvent: MouseEvent) {\n  root.value?.dispatchEvent(\n    new CustomEvent('dragstartcell', {\n      bubbles: true,\n      cancelable: true,\n      composed: true,\n      detail: {\n        originalEvent,\n        model: {\n          prop: props.prop,\n          model: props.model,\n          column: props.column,\n          rowIndex: props.rowIndex,\n          colIndex: props.colIndex,\n          colType: props.colType,\n          type: props.type,\n          data: props.data,\n        },\n      },\n    }),\n  );\n}\n</script>\n\n<template>\n  <span ref=\"root\" class=\"revo-draggable\" @mousedown=\"onMousedown\">\n    <component :is=\"part\" />\n  </span>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;EAUA,IAAM,IAAQ,GAcR,IAAO,EAAwB,KAAK;EAE1C,SAAS,EAAY,GAA2B;AAC9C,KAAK,OAAO,cACV,IAAI,YAAY,iBAAiB;IAC/B,SAAS;IACT,YAAY;IACZ,UAAU;IACV,QAAQ;KACN;KACA,OAAO;MACL,MAAM,EAAM;MACZ,OAAO,EAAM;MACb,QAAQ,EAAM;MACd,UAAU,EAAM;MAChB,UAAU,EAAM;MAChB,SAAS,EAAM;MACf,MAAM,EAAM;MACZ,MAAM,EAAM;MACb;KACF;IACF,CAAC,CACH;;yBAKD,EAEO,QAAA;YAFG;GAAJ,KAAI;GAAO,OAAM;GAA6B;YAClD,EAAwB,EAAR,EAAA,KAAI,CAAA,EAAA,EAAA,IAAA"}

package/dist/grid/cells/GridFormattedCell.d.ts

@@ -0,0 +1,9 @@
+type __VLS_Props = {
+    value?: unknown;
+    model: Record<string, unknown>;
+    formatter: (value: unknown, row: Record<string, unknown>) => string;
+};
+declare const __VLS_export: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;
+//# sourceMappingURL=GridFormattedCell.vue.d.ts.map

package/dist/grid/cells/GridFormattedCell.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"GridFormattedCell.d.ts","sourceRoot":"","sources":["../../../src/grid/cells/GridFormattedCell.vue"],"names":[],"mappings":"AAsBA,KAAK,WAAW,GAAG;IACjB,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,KAAK,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IAC/B,SAAS,EAAE,CAAC,KAAK,EAAE,OAAO,EAAE,GAAG,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,KAAK,MAAM,CAAC;CACrE,CAAC;AA6BF,QAAA,MAAM,YAAY,kSAEhB,CAAC;wBACkB,OAAO,YAAY;AAAxC,wBAAyC"}

package/dist/grid/cells/GridFormattedCell.js

@@ -0,0 +1,7 @@
+import e from "./GridFormattedCell.vue_vue_type_script_setup_true_lang.js";
+//#region src/grid/cells/GridFormattedCell.vue
+var t = e;
+//#endregion
+export { t as default };
+
+//# sourceMappingURL=GridFormattedCell.js.map

package/dist/grid/cells/GridFormattedCell.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"GridFormattedCell.js","names":[],"sources":["../../../src/grid/cells/GridFormattedCell.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed } from 'vue';\n\nconst props = defineProps<{\n  value?: unknown;\n  model: Record<string, unknown>;\n  formatter: (value: unknown, row: Record<string, unknown>) => string;\n}>();\n\ndefineOptions({ inheritAttrs: false });\n\nconst text = computed(() => props.formatter(props.value, props.model));\n</script>\n\n<template>\n  <span class=\"flex h-full w-full items-center\">{{ text }}</span>\n</template>\n"],"mappings":""}

package/dist/grid/cells/GridFormattedCell.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,19 @@
+import { computed as e, createElementBlock as t, defineComponent as n, openBlock as r, toDisplayString as i } from "vue";
+//#region src/grid/cells/GridFormattedCell.vue?vue&type=script&setup=true&lang.ts
+var a = { class: "flex h-full w-full items-center" }, o = /* @__PURE__ */ n({
+	inheritAttrs: !1,
+	__name: "GridFormattedCell",
+	props: {
+		value: {},
+		model: {},
+		formatter: { type: Function }
+	},
+	setup(n) {
+		let o = n, s = e(() => o.formatter(o.value, o.model));
+		return (e, n) => (r(), t("span", a, i(s.value), 1));
+	}
+});
+//#endregion
+export { o as default };
+
+//# sourceMappingURL=GridFormattedCell.vue_vue_type_script_setup_true_lang.js.map

package/dist/grid/cells/GridFormattedCell.vue_vue_type_script_setup_true_lang.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"GridFormattedCell.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/grid/cells/GridFormattedCell.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed } from 'vue';\n\nconst props = defineProps<{\n  value?: unknown;\n  model: Record<string, unknown>;\n  formatter: (value: unknown, row: Record<string, unknown>) => string;\n}>();\n\ndefineOptions({ inheritAttrs: false });\n\nconst text = computed(() => props.formatter(props.value, props.model));\n</script>\n\n<template>\n  <span class=\"flex h-full w-full items-center\">{{ text }}</span>\n</template>\n"],"mappings":";;;;;;;;;;;EAGA,IAAM,IAAQ,GAQR,IAAO,QAAe,EAAM,UAAU,EAAM,OAAO,EAAM,MAAM,CAAC;yBAIpE,EAA+D,QAA/D,GAA+D,EAAd,EAAA,MAAI,EAAA,EAAA"}

package/dist/grid/cells/GridHeaderCell.d.ts

@@ -0,0 +1,11 @@
+type __VLS_Props = {
+    name?: string;
+    info?: string;
+    infoHighlight?: string;
+    /** Accessible label of the info trigger. */
+    infoLabel?: string;
+};
+declare const __VLS_export: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;
+//# sourceMappingURL=GridHeaderCell.vue.d.ts.map

package/dist/grid/cells/GridHeaderCell.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"GridHeaderCell.d.ts","sourceRoot":"","sources":["../../../src/grid/cells/GridHeaderCell.vue"],"names":[],"mappings":"AAiDA,KAAK,WAAW,GAAG;IACjB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,4CAA4C;IAC5C,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAsGF,QAAA,MAAM,YAAY,kSAEhB,CAAC;wBACkB,OAAO,YAAY;AAAxC,wBAAyC"}

package/dist/grid/cells/GridHeaderCell.js

@@ -0,0 +1,7 @@
+import e from "./GridHeaderCell.vue_vue_type_script_setup_true_lang.js";
+//#region src/grid/cells/GridHeaderCell.vue
+var t = e;
+//#endregion
+export { t as default };
+
+//# sourceMappingURL=GridHeaderCell.js.map

package/dist/grid/cells/GridHeaderCell.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"GridHeaderCell.js","names":[],"sources":["../../../src/grid/cells/GridHeaderCell.vue"],"sourcesContent":["<script setup lang=\"ts\">\n/** Column header with an info popover. Text arrives resolved. */\nimport IconPencilSimple from '~icons/ph/pencil-simple';\nimport WellInfoPopover from '../../components/WellInfoPopover.vue';\n\ndefineProps<{\n  name?: string;\n  info?: string;\n  infoHighlight?: string;\n  /** Accessible label of the info trigger. */\n  infoLabel?: string;\n}>();\n\ndefineOptions({ inheritAttrs: false });\n</script>\n\n<template>\n  <span class=\"inline-flex items-center gap-1 min-w-0\">\n    <span class=\"truncate\">{{ name }}</span>\n    <span\n      v-if=\"info\"\n      class=\"inline-flex shrink-0 normal-case tracking-normal\"\n      @click.stop\n      @mousedown.stop\n    >\n      <WellInfoPopover :info=\"info\" :label=\"infoLabel\">\n        <div class=\"flex flex-col gap-2.5\">\n          <p class=\"m-0\">{{ info }}</p>\n          <p\n            v-if=\"infoHighlight\"\n            class=\"m-0 flex items-start gap-1.5 rounded-md border border-primary-500/30 bg-primary-500/10 px-2.5 py-2 text-content-0\"\n          >\n            <IconPencilSimple\n              class=\"size-3.5 shrink-0 mt-0.5 text-primary-500\"\n            />\n            <span>{{ infoHighlight }}</span>\n          </p>\n        </div>\n      </WellInfoPopover>\n    </span>\n  </span>\n</template>\n"],"mappings":""}