@eos-ui/vue 0.0.0-stage → 0.1.1

package/dist/components/RangePicker/ERangePicker.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,296 @@
+/* empty css                */
+import { useConfig as e, useMessages as t, usePortalTarget as n } from "../../config.js";
+import { useFieldAttrs as r } from "../../composables/useFieldAttrs.js";
+import { useLocale as ee } from "../../composables/useLocale.js";
+import te from "../Icon/EIcon.js";
+import i from "../Field/EField.js";
+/* empty css                 */
+import { useQuietFocus as a } from "../Select/quietFocus.js";
+/* empty css                */
+import o from "../Button/EButton.js";
+import { addDays as s, compareDays as c, isoDate as l, startOfDay as ne } from "../Calendar/dates.js";
+import re from "../Calendar/ECalendar.js";
+/* empty css                   */
+import { Fragment as ie, computed as u, createBlock as d, createCommentVNode as f, createElementBlock as p, createElementVNode as m, createTextVNode as ae, createVNode as h, defineComponent as g, mergeModels as _, mergeProps as v, nextTick as y, openBlock as b, ref as x, renderList as S, toDisplayString as C, unref as w, useModel as T, vModelText as E, watch as D, withCtx as O, withDirectives as k } from "vue";
+import { PopoverAnchor as oe, PopoverContent as se, PopoverPortal as ce, PopoverRoot as le, PopoverTrigger as A } from "reka-ui";
+//#region src/components/RangePicker/ERangePicker.vue?vue&type=script&setup=true&lang.ts
+var ue = [
+	"aria-labelledby",
+	"data-invalid",
+	"data-disabled"
+], de = [
+	"id",
+	"placeholder",
+	"aria-label",
+	"disabled",
+	"required",
+	"aria-invalid",
+	"aria-describedby"
+], fe = {
+	class: "e-range-sep",
+	"aria-hidden": "true"
+}, pe = [
+	"placeholder",
+	"aria-label",
+	"disabled",
+	"required",
+	"aria-invalid",
+	"aria-describedby"
+], me = ["name", "value"], j = ["name", "value"], M = ["aria-label", "disabled"], N = { class: "e-cal-presets" }, P = /*@__PURE__*/ g({
+	inheritAttrs: !1,
+	__name: "ERangePicker",
+	props: /*@__PURE__*/ _({
+		label: {},
+		hideLabel: { type: Boolean },
+		hint: {},
+		error: {},
+		required: { type: Boolean },
+		optional: { type: Boolean },
+		disabled: { type: Boolean },
+		min: {},
+		max: {},
+		startName: {},
+		endName: {},
+		presets: {},
+		id: {}
+	}, {
+		start: { default: null },
+		startModifiers: {},
+		end: { default: null },
+		endModifiers: {},
+		open: {
+			type: Boolean,
+			default: !1
+		},
+		openModifiers: {}
+	}),
+	emits: [
+		"update:start",
+		"update:end",
+		"update:open"
+	],
+	setup(g, { expose: _ }) {
+		let P = g, F = T(g, "start"), I = T(g, "end"), L = t(), R = e(), z = ee(), he = n(), B = r(), V = T(g, "open"), H = u(() => V.value && !P.disabled), U = a(H, (e) => !!e.closest(".e-calpanel, .e-combo")), ge = {
+			onClick: U.intent,
+			onKeydown: U.intent
+		}, W = x(z.formatDate(F.value)), G = x(z.formatDate(I.value)), K = x(""), q = x({
+			start: F.value,
+			end: I.value
+		}), J = x(null), Y = x(null);
+		D([
+			() => F.value?.getTime(),
+			() => I.value?.getTime(),
+			() => R.locale
+		], () => {
+			W.value = z.formatDate(F.value), G.value = z.formatDate(I.value);
+		}), D(V, (e) => {
+			e && (q.value = {
+				start: F.value,
+				end: I.value
+			});
+		});
+		let X = u(() => P.error || K.value), _e = u(() => {
+			if (P.presets) return P.presets;
+			let e = ne(/* @__PURE__ */ new Date());
+			return [
+				{
+					label: L("last7"),
+					get: () => ({
+						start: s(e, -6),
+						end: e
+					})
+				},
+				{
+					label: L("last30"),
+					get: () => ({
+						start: s(e, -29),
+						end: e
+					})
+				},
+				{
+					label: L("thisMonth"),
+					get: () => ({
+						start: new Date(e.getFullYear(), e.getMonth(), 1, 12),
+						end: e
+					})
+				}
+			];
+		});
+		function Z(e) {
+			F.value = e.start, I.value = e.end, W.value = z.formatDate(e.start), G.value = z.formatDate(e.end), K.value = "";
+		}
+		let ve = (e) => !!P.min && c(e, P.min) < 0 || !!P.max && c(e, P.max) > 0;
+		function Q() {
+			let e = W.value.trim() ? z.parseDate(W.value) : null, t = G.value.trim() ? z.parseDate(G.value) : null;
+			if (W.value.trim() && !e || G.value.trim() && !t) {
+				K.value = L("datesError", { format: z.dateFormatLabel() });
+				return;
+			}
+			let n = [e, t].find((e) => e && ve(e));
+			n ? K.value = L("dateBetween", {
+				min: z.formatDate(P.min || n),
+				max: z.formatDate(P.max || n)
+			}) : e && t && c(t, e) < 0 ? K.value = L("endBeforeStart") : Z({
+				start: e,
+				end: t
+			});
+		}
+		function ye(e) {
+			q.value = e, e.start && e.end && (Z(e), V.value = !1);
+		}
+		function be(e) {
+			Z(e.get()), V.value = !1;
+		}
+		function xe(e) {
+			e.preventDefault(), U.personOpened() && y(() => J.value?.focusDay());
+		}
+		function Se(e) {
+			U.returnsFocus() || e.preventDefault();
+		}
+		function Ce(e) {
+			J.value && J.value.view !== "days" && e.preventDefault();
+		}
+		function $(e) {
+			e.key === "Enter" ? Q() : e.key === "ArrowDown" && e.altKey && !P.disabled && (e.preventDefault(), U.intent(), V.value = !0);
+		}
+		return _({
+			input: Y,
+			focus: () => Y.value?.focus()
+		}), (e, t) => (b(), d(i, v(w(B).wrapper(), {
+			id: g.id,
+			label: g.label,
+			"hide-label": g.hideLabel,
+			hint: g.hint,
+			error: X.value,
+			required: g.required,
+			optional: g.optional
+		}), {
+			default: O((e) => [h(w(le), {
+				open: H.value,
+				"onUpdate:open": t[4] ||= (e) => V.value = e
+			}, {
+				default: O(() => [h(w(oe), { "as-child": "" }, {
+					default: O(() => [m("div", v(w(B).input(), {
+						class: "e-input-wrap e-combo e-rangefield",
+						role: "group",
+						"aria-labelledby": `${e.id}-label`,
+						"data-invalid": X.value ? "" : void 0,
+						"data-disabled": g.disabled ? "" : void 0
+					}), [
+						k(m("input", {
+							id: e.id,
+							ref_key: "startInput",
+							ref: Y,
+							"onUpdate:modelValue": t[0] ||= (e) => W.value = e,
+							class: "e-input e-combo-input",
+							type: "text",
+							inputmode: "numeric",
+							autocomplete: "off",
+							placeholder: w(L)("startDate"),
+							"aria-label": w(L)("startDate"),
+							disabled: g.disabled,
+							required: g.required,
+							"aria-invalid": e.ariaInvalid,
+							"aria-describedby": e.ariaDescribedby,
+							onInput: t[1] ||= (e) => K.value = "",
+							onBlur: Q,
+							onKeydown: $
+						}, null, 40, de), [[E, W.value]]),
+						m("span", fe, C(w(L)("to")), 1),
+						k(m("input", {
+							"onUpdate:modelValue": t[2] ||= (e) => G.value = e,
+							class: "e-input e-combo-input",
+							type: "text",
+							inputmode: "numeric",
+							autocomplete: "off",
+							placeholder: w(L)("endDate"),
+							"aria-label": w(L)("endDate"),
+							disabled: g.disabled,
+							required: g.required,
+							"aria-invalid": e.ariaInvalid,
+							"aria-describedby": e.ariaDescribedby,
+							onInput: t[3] ||= (e) => K.value = "",
+							onBlur: Q,
+							onKeydown: $
+						}, null, 40, pe), [[E, G.value]]),
+						g.startName ? (b(), p("input", {
+							key: 0,
+							type: "hidden",
+							name: g.startName,
+							value: w(l)(F.value)
+						}, null, 8, me)) : f("", !0),
+						g.endName ? (b(), p("input", {
+							key: 1,
+							type: "hidden",
+							name: g.endName,
+							value: w(l)(I.value)
+						}, null, 8, j)) : f("", !0),
+						h(w(A), v({ "as-child": "" }, ge), {
+							default: O(() => [m("button", {
+								type: "button",
+								class: "e-combo-btn",
+								"aria-label": w(L)("chooseDates"),
+								disabled: g.disabled
+							}, [h(te, { name: "calendar" })], 8, M)]),
+							_: 1
+						}, 16)
+					], 16, ue)]),
+					_: 2
+				}, 1024), h(w(ce), { to: w(he) }, {
+					default: O(() => [h(w(se), {
+						class: "e-calpanel e-root",
+						"aria-label": w(L)("chooseDates"),
+						dir: w(R).dir ?? void 0,
+						side: "bottom",
+						align: "start",
+						"side-offset": 6,
+						"collision-padding": 8,
+						onOpenAutoFocus: xe,
+						onCloseAutoFocus: Se,
+						onEscapeKeyDown: Ce
+					}, {
+						default: O(() => [h(re, {
+							ref_key: "calendar",
+							ref: J,
+							mode: "range",
+							start: q.value.start,
+							end: q.value.end,
+							min: g.min,
+							max: g.max,
+							footer: !1,
+							onRangeChange: ye
+						}, null, 8, [
+							"start",
+							"end",
+							"min",
+							"max"
+						]), m("div", N, [(b(!0), p(ie, null, S(_e.value, (e) => (b(), d(o, {
+							key: e.label,
+							variant: "outline",
+							onClick: (t) => be(e)
+						}, {
+							default: O(() => [ae(C(e.label), 1)]),
+							_: 2
+						}, 1032, ["onClick"]))), 128))])]),
+						_: 1
+					}, 8, ["aria-label", "dir"])]),
+					_: 1
+				}, 8, ["to"])]),
+				_: 2
+			}, 1032, ["open"])]),
+			_: 1
+		}, 16, [
+			"id",
+			"label",
+			"hide-label",
+			"hint",
+			"error",
+			"required",
+			"optional"
+		]));
+	}
+});
+//#endregion
+export { P as default };
+
+//# sourceMappingURL=ERangePicker.vue_vue_type_script_setup_true_lang.js.map

package/dist/components/RangePicker/ERangePicker.vue_vue_type_script_setup_true_lang.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ERangePicker.vue_vue_type_script_setup_true_lang.js","names":["_useModel","_openBlock","_createBlock","EField","_mergeProps","_unref","_withCtx","_createVNode","_createElementVNode","_withDirectives","_vModelText","_toDisplayString","_createElementBlock","_createCommentVNode","EIcon","ECalendar","_Fragment","_renderList","EButton","_createTextVNode","EIcon_default","EField_default","EButton_default","ECalendar_default","_hoisted_1","_hoisted_2","_hoisted_3","_hoisted_4","_hoisted_5","_hoisted_6","_hoisted_7","_hoisted_8","ERangePicker_vue_vue_type_script_setup_true_lang_default","\"start\"","\"startModifiers\"","\"end\"","\"endModifiers\"","\"open\"","\"openModifiers\"","__expose","props","__props","start","useModel","end","t","useMessages","config","useConfig","loc","useLocale","portal","usePortalTarget","attrs","useFieldAttrs","open","shown","computed","quiet","useQuietFocus","el","trigger","startText","ref","endText","typedError","draft","calendar","startInput","watch","isOpen","shownError","presets","today","startOfDay","addDays","setRange","r","outOfBounds","compareDays","d","commitText","a","b","bad","onRange","applyPreset","p","onOpenFocus","nextTick","onCloseFocus","onEscape","onKey","openBlock","createBlock","mergeProps","unref","withCtx","createVNode","PopoverRoot","_cache","$event","PopoverAnchor","createElementVNode","field","withDirectives","vModelText","toDisplayString","createElementBlock","isoDate","createCommentVNode","PopoverTrigger","PopoverPortal","PopoverContent","Fragment","renderList","createTextVNode"],"sources":["../../../src/components/RangePicker/ERangePicker.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, nextTick, ref, watch } from \"vue\";\nimport { PopoverAnchor, PopoverContent, PopoverPortal, PopoverRoot, PopoverTrigger } from \"reka-ui\";\nimport EButton from \"../Button/EButton.vue\";\nimport ECalendar from \"../Calendar/ECalendar.vue\";\nimport type { CalendarRange } from \"../Calendar/ECalendar.vue\";\nimport EField from \"../Field/EField.vue\";\nimport EIcon from \"../Icon/EIcon.vue\";\nimport { addDays, compareDays, isoDate, startOfDay } from \"../Calendar/dates.js\";\nimport { useConfig, useMessages, usePortalTarget } from \"../../config.js\";\nimport { useFieldAttrs } from \"../../composables/useFieldAttrs.js\";\nimport { useQuietFocus } from \"../Select/quietFocus.js\";\nimport { useLocale } from \"../../composables/useLocale.js\";\nimport \"../../styles/base.css\";\nimport \"../TextField/input.css\";\nimport \"../Combobox/combo.css\";\nimport \"../DatePicker/picker.css\";\n\nexport interface RangePreset {\n  /** The button text, such as \"Last 7 days\". */\n  label: string;\n  /** The span the button chooses. */\n  get: () => { start: Date; end: Date };\n}\n\ndefineOptions({ inheritAttrs: false });\n\nconst props = defineProps<{\n  /** The visible label, a mono kicker above the field. */\n  label: string;\n  /** Keep the label for screen readers and remove it from the page. */\n  hideLabel?: boolean;\n  /** Help that stays under the field. */\n  hint?: string;\n  /** What to fix. Replaces the hint and marks both boxes invalid. A typed span that cannot be used shows its own error. */\n  error?: string;\n  /** A word beside the label. */\n  required?: boolean;\n  /** A word beside the label. Flag whichever is rarer. */\n  optional?: boolean;\n  disabled?: boolean;\n  /** The earliest date that can be chosen or typed. */\n  min?: Date;\n  /** The latest date that can be chosen or typed. */\n  max?: Date;\n  /** Submits the first date as `YYYY-MM-DD` with a form. */\n  startName?: string;\n  /** Submits the last date as `YYYY-MM-DD` with a form. */\n  endName?: string;\n  /** Buttons under the calendar that choose a span at once. Default: Last 7 days, Last 30 days, This month. */\n  presets?: RangePreset[];\n  /** The id of the start box; the label points at it. Generated when left out. */\n  id?: string;\n}>();\n\nconst start = defineModel<Date | null>(\"start\", { default: null });\nconst end = defineModel<Date | null>(\"end\", { default: null });\n\nconst t = useMessages();\nconst config = useConfig();\nconst loc = useLocale();\nconst portal = usePortalTarget();\nconst attrs = useFieldAttrs();\n\nconst open = defineModel<boolean>(\"open\", { default: false });\nconst shown = computed(() => open.value && !props.disabled);\nconst quiet = useQuietFocus(shown, (el) => !!el.closest(\".e-calpanel, .e-combo\"));\nconst trigger = { onClick: quiet.intent, onKeydown: quiet.intent };\n\nconst startText = ref(loc.formatDate(start.value));\nconst endText = ref(loc.formatDate(end.value));\nconst typedError = ref(\"\");\nconst draft = ref<CalendarRange>({ start: start.value, end: end.value });\nconst calendar = ref<InstanceType<typeof ECalendar> | null>(null);\nconst startInput = ref<HTMLInputElement | null>(null);\n\nwatch([() => start.value?.getTime(), () => end.value?.getTime(), () => config.locale], () => {\n  startText.value = loc.formatDate(start.value);\n  endText.value = loc.formatDate(end.value);\n});\nwatch(open, (isOpen) => {\n  if (isOpen) draft.value = { start: start.value, end: end.value };\n});\n\nconst shownError = computed(() => props.error || typedError.value);\n\nconst presets = computed<RangePreset[]>(() => {\n  if (props.presets) return props.presets;\n  const today = startOfDay(new Date());\n  return [\n    { label: t(\"last7\"), get: () => ({ start: addDays(today, -6), end: today }) },\n    { label: t(\"last30\"), get: () => ({ start: addDays(today, -29), end: today }) },\n    {\n      label: t(\"thisMonth\"),\n      get: () => ({ start: new Date(today.getFullYear(), today.getMonth(), 1, 12), end: today }),\n    },\n  ];\n});\n\nfunction setRange(r: { start: Date | null; end: Date | null }) {\n  start.value = r.start;\n  end.value = r.end;\n  startText.value = loc.formatDate(r.start);\n  endText.value = loc.formatDate(r.end);\n  typedError.value = \"\";\n}\n\nconst outOfBounds = (d: Date) =>\n  (!!props.min && compareDays(d, props.min) < 0) || (!!props.max && compareDays(d, props.max) > 0);\n\nfunction commitText() {\n  const a = startText.value.trim() ? loc.parseDate(startText.value) : null;\n  const b = endText.value.trim() ? loc.parseDate(endText.value) : null;\n  if ((startText.value.trim() && !a) || (endText.value.trim() && !b)) {\n    typedError.value = t(\"datesError\", { format: loc.dateFormatLabel() });\n    return;\n  }\n  const bad = [a, b].find((d) => d && outOfBounds(d));\n  if (bad) {\n    typedError.value = t(\"dateBetween\", {\n      min: loc.formatDate(props.min || bad),\n      max: loc.formatDate(props.max || bad),\n    });\n    return;\n  }\n  if (a && b && compareDays(b, a) < 0) {\n    typedError.value = t(\"endBeforeStart\");\n    return;\n  }\n  setRange({ start: a, end: b });\n}\n\nfunction onRange(r: CalendarRange) {\n  draft.value = r;\n  if (r.start && r.end) {\n    setRange(r);\n    open.value = false;\n  }\n}\nfunction applyPreset(p: RangePreset) {\n  setRange(p.get());\n  open.value = false;\n}\n\nfunction onOpenFocus(e: Event) {\n  e.preventDefault();\n  if (!quiet.personOpened()) return;\n  void nextTick(() => calendar.value?.focusDay());\n}\nfunction onCloseFocus(e: Event) {\n  if (!quiet.returnsFocus()) e.preventDefault();\n}\nfunction onEscape(e: KeyboardEvent) {\n  if (calendar.value && calendar.value.view !== \"days\") e.preventDefault();\n}\nfunction onKey(e: KeyboardEvent) {\n  if (e.key === \"Enter\") commitText();\n  else if (e.key === \"ArrowDown\" && e.altKey && !props.disabled) {\n    e.preventDefault();\n    quiet.intent();\n    open.value = true;\n  }\n}\n\ndefineExpose({\n  input: startInput,\n  focus: () => startInput.value?.focus(),\n});\n</script>\n\n<template>\n  <EField\n    v-bind=\"attrs.wrapper()\"\n    :id=\"id\"\n    :label=\"label\"\n    :hide-label=\"hideLabel\"\n    :hint=\"hint\"\n    :error=\"shownError\"\n    :required=\"required\"\n    :optional=\"optional\"\n  >\n    <template #default=\"field\">\n      <PopoverRoot :open=\"shown\" @update:open=\"open = $event\">\n        <PopoverAnchor as-child>\n          <div\n            v-bind=\"attrs.input()\"\n            class=\"e-input-wrap e-combo e-rangefield\"\n            role=\"group\"\n            :aria-labelledby=\"`${field.id}-label`\"\n            :data-invalid=\"shownError ? '' : undefined\"\n            :data-disabled=\"disabled ? '' : undefined\"\n          >\n            <input\n              :id=\"field.id\"\n              ref=\"startInput\"\n              v-model=\"startText\"\n              class=\"e-input e-combo-input\"\n              type=\"text\"\n              inputmode=\"numeric\"\n              autocomplete=\"off\"\n              :placeholder=\"t('startDate')\"\n              :aria-label=\"t('startDate')\"\n              :disabled=\"disabled\"\n              :required=\"required\"\n              :aria-invalid=\"field.ariaInvalid\"\n              :aria-describedby=\"field.ariaDescribedby\"\n              @input=\"typedError = ''\"\n              @blur=\"commitText\"\n              @keydown=\"onKey\"\n            />\n            <span class=\"e-range-sep\" aria-hidden=\"true\">{{ t(\"to\") }}</span>\n            <input\n              v-model=\"endText\"\n              class=\"e-input e-combo-input\"\n              type=\"text\"\n              inputmode=\"numeric\"\n              autocomplete=\"off\"\n              :placeholder=\"t('endDate')\"\n              :aria-label=\"t('endDate')\"\n              :disabled=\"disabled\"\n              :required=\"required\"\n              :aria-invalid=\"field.ariaInvalid\"\n              :aria-describedby=\"field.ariaDescribedby\"\n              @input=\"typedError = ''\"\n              @blur=\"commitText\"\n              @keydown=\"onKey\"\n            />\n            <input v-if=\"startName\" type=\"hidden\" :name=\"startName\" :value=\"isoDate(start)\" />\n            <input v-if=\"endName\" type=\"hidden\" :name=\"endName\" :value=\"isoDate(end)\" />\n            <PopoverTrigger as-child v-bind=\"trigger\">\n              <button type=\"button\" class=\"e-combo-btn\" :aria-label=\"t('chooseDates')\" :disabled=\"disabled\">\n                <EIcon name=\"calendar\" />\n              </button>\n            </PopoverTrigger>\n          </div>\n        </PopoverAnchor>\n        <PopoverPortal :to=\"portal\">\n          <PopoverContent\n            class=\"e-calpanel e-root\"\n            :aria-label=\"t('chooseDates')\"\n            :dir=\"config.dir ?? undefined\"\n            side=\"bottom\"\n            align=\"start\"\n            :side-offset=\"6\"\n            :collision-padding=\"8\"\n            @open-auto-focus=\"onOpenFocus\"\n            @close-auto-focus=\"onCloseFocus\"\n            @escape-key-down=\"onEscape\"\n          >\n            <ECalendar\n              ref=\"calendar\"\n              mode=\"range\"\n              :start=\"draft.start\"\n              :end=\"draft.end\"\n              :min=\"min\"\n              :max=\"max\"\n              :footer=\"false\"\n              @range-change=\"onRange\"\n            />\n            <div class=\"e-cal-presets\">\n              <EButton v-for=\"p in presets\" :key=\"p.label\" variant=\"outline\" @click=\"applyPreset(p)\">\n                {{ p.label }}\n              </EButton>\n            </div>\n          </PopoverContent>\n        </PopoverPortal>\n      </PopoverRoot>\n    </template>\n  </EField>\n</template>\n\n<style>\n@layer e.composites {\n  .e-cal-presets {\n    display: flex;\n    flex-wrap: wrap;\n    gap: var(--e-space-2);\n    margin-top: var(--e-space-3);\n    padding-top: var(--e-space-3);\n    border-top: var(--e-stroke-hair) solid var(--e-border);\n  }\n\n  .e-rangefield .e-input {\n    flex: 1 1 5rem;\n  }\n\n  .e-range-sep {\n    flex: none;\n    font: 500 var(--e-text-sm) / 1 var(--e-font-sans);\n    color: var(--e-muted);\n  }\n}\n</style>\n"],"mappings":"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"}

package/dist/components/RangePicker/index.d.ts

@@ -0,0 +1,2 @@
+export { default as ERangePicker } from './ERangePicker.vue.js';
+export type { RangePreset } from './ERangePicker.vue.js';

package/dist/components/SearchBar/ESearchBar.js

@@ -0,0 +1,8 @@
+import e from "./ESearchBar.vue_vue_type_script_setup_true_lang.js";
+/* empty css                                           */
+//#region src/components/SearchBar/ESearchBar.vue
+var t = e;
+//#endregion
+export { t as default };
+
+//# sourceMappingURL=ESearchBar.js.map

package/dist/components/SearchBar/ESearchBar.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ESearchBar.js","names":["_sfc_main","ESearchBar_vue_vue_type_script_setup_true_lang_default","ESearchBar_default"],"sources":["../../../src/components/SearchBar/ESearchBar.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport EIcon from \"../Icon/EIcon.vue\";\nimport EButton from \"../Button/EButton.vue\";\nimport { ref } from \"vue\";\nimport { useMessages } from \"../../config.js\";\nimport { useFieldAttrs } from \"../../composables/useFieldAttrs.js\";\nimport \"../../styles/base.css\";\nimport \"../TextField/input.css\";\n\ndefineOptions({ inheritAttrs: false });\n\nwithDefaults(\n  defineProps<{\n    /** What screen readers call the box. Default \"Search\". */\n    label?: string;\n    /** Say what can be searched, briefly. Default \"Search\". */\n    placeholder?: string;\n    /** The text on the button. Default \"Search\". */\n    action?: string;\n    /** Leaves out the button, for a box that filters or searches as you type. Enter still submits. */\n    hideAction?: boolean;\n    /** The clear button, shown when there is text. On by default. */\n    clearable?: boolean;\n    /** The name submitted with a form. Default `q`. */\n    name?: string;\n    /** Search is unavailable. Say why in a Notice. */\n    disabled?: boolean;\n  }>(),\n  { clearable: true },\n);\n\nconst emit = defineEmits<{\n  /** The person pressed Enter or the button. */\n  submit: [value: string];\n}>();\n\nconst model = defineModel<string>({ default: \"\" });\n\nconst t = useMessages();\nconst attrs = useFieldAttrs();\nconst box = ref<HTMLInputElement | null>(null);\n\nfunction clear() {\n  model.value = \"\";\n  box.value?.focus();\n}\n\ndefineExpose({\n  input: box,\n  focus: () => box.value?.focus(),\n});\n</script>\n\n<template>\n  <form\n    class=\"e-search\"\n    v-bind=\"attrs.wrapper()\"\n    role=\"search\"\n    :aria-label=\"label || t('search')\"\n    @submit.prevent=\"emit('submit', model)\"\n  >\n    <span class=\"e-search-lead\"><EIcon name=\"search\" /></span>\n    <input\n      ref=\"box\"\n      v-bind=\"attrs.input()\"\n      class=\"e-input\"\n      :name=\"name || 'q'\"\n      :aria-label=\"label || t('search')\"\n      :placeholder=\"placeholder || t('search')\"\n      :value=\"model\"\n      :disabled=\"disabled\"\n      @input=\"model = ($event.target as HTMLInputElement).value\"\n    />\n    <button\n      v-if=\"clearable && model && !disabled\"\n      type=\"button\"\n      class=\"e-search-clear\"\n      :aria-label=\"t('clear')\"\n      @mousedown.prevent\n      @click=\"clear\"\n    >\n      <EIcon name=\"x\" />\n    </button>\n    <EButton v-if=\"!hideAction\" type=\"submit\" :disabled=\"disabled\">{{ action || t(\"search\") }}</EButton>\n  </form>\n</template>\n\n<style>\n@layer e.controls {\n  .e-search {\n    display: flex;\n    align-items: center;\n    gap: var(--e-space-1);\n    height: var(--e-control-height);\n    padding: 0 var(--e-space-1) 0 var(--e-space-2);\n    border: var(--e-stroke-edge) solid var(--e-border-strong);\n    border-radius: var(--e-radius-md);\n    background: var(--e-surface);\n    box-shadow: var(--e-well);\n    transition: border-color var(--e-duration-tap) var(--e-easing-out);\n  }\n\n  .e-search:hover {\n    border-color: var(--e-ink);\n  }\n\n  .e-search .e-btn {\n    position: relative;\n    height: calc(var(--e-control-height) - 6px);\n    padding: 0 var(--e-space-3);\n    font-size: var(--e-text-md);\n  }\n\n  .e-search .e-btn::after {\n    content: \"\";\n    position: absolute;\n    inset: -3px;\n  }\n\n  .e-search-clear {\n    display: inline-grid;\n    place-items: center;\n    position: relative;\n    flex: none;\n    width: calc(var(--e-control-height) - 9px);\n    height: calc(var(--e-control-height) - 9px);\n    padding: 0;\n    border: 0;\n    border-radius: var(--e-radius-sm);\n    background: transparent;\n    color: var(--e-ink);\n    cursor: pointer;\n    transition: background-color var(--e-duration-tap) var(--e-easing-out);\n  }\n\n  .e-search-clear::after {\n    content: \"\";\n    position: absolute;\n    inset: -5px;\n  }\n\n  .e-search-clear:hover {\n    background: var(--e-wash-hover);\n    box-shadow: inset 0 0 0 1px var(--e-wash-ring);\n  }\n\n  .e-search-clear:active {\n    background: var(--e-wash-press);\n    box-shadow: inset 0 0 0 1.5px var(--e-ink);\n  }\n\n  .e-search-clear:focus-visible {\n    outline: var(--e-stroke-focus) solid var(--e-focus-ring);\n    outline-offset: calc(-1 * var(--e-stroke-focus));\n  }\n\n  .e-search-lead {\n    display: grid;\n    place-items: center;\n    flex: none;\n    width: 28px;\n    color: var(--e-muted);\n  }\n\n  .e-search .e-input {\n    flex: 1;\n    text-overflow: ellipsis;\n    height: 100%;\n    border: 0;\n    background: transparent;\n    box-shadow: none;\n    font-size: var(--e-text-md);\n    padding-inline: var(--e-space-2);\n  }\n\n  .e-search .e-input:hover,\n  .e-search .e-input:focus {\n    border: 0;\n    background: transparent;\n  }\n\n  .e-search .e-input:focus-visible {\n    outline: none;\n  }\n\n  .e-search:focus-within {\n    border-color: var(--e-focus-field);\n    outline: var(--e-stroke-focus) solid var(--e-focus-field);\n    outline-offset: var(--e-focus-gap-field);\n  }\n\n  @media (prefers-reduced-motion: reduce) {\n    .e-search {\n      transition: none;\n    }\n  }\n\n  @media print {\n    .e-search {\n      display: none;\n    }\n  }\n}\n</style>\n"],"mappings":""}

package/dist/components/SearchBar/ESearchBar.vue.d.ts

@@ -0,0 +1,34 @@
+type __VLS_Props = {
+    /** What screen readers call the box. Default "Search". */
+    label?: string;
+    /** Say what can be searched, briefly. Default "Search". */
+    placeholder?: string;
+    /** The text on the button. Default "Search". */
+    action?: string;
+    /** Leaves out the button, for a box that filters or searches as you type. Enter still submits. */
+    hideAction?: boolean;
+    /** The clear button, shown when there is text. On by default. */
+    clearable?: boolean;
+    /** The name submitted with a form. Default `q`. */
+    name?: string;
+    /** Search is unavailable. Say why in a Notice. */
+    disabled?: boolean;
+};
+type __VLS_ModelProps = {
+    modelValue?: string;
+};
+type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
+declare const __VLS_export: import('vue').DefineComponent<__VLS_PublicProps, {
+    input: import('vue').Ref<HTMLInputElement | null, HTMLInputElement | null>;
+    focus: () => void | undefined;
+}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    "update:modelValue": (value: string) => any;
+    submit: (value: string) => any;
+}, string, import('vue').PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
+    "onUpdate:modelValue"?: ((value: string) => any) | undefined;
+    onSubmit?: ((value: string) => any) | undefined;
+}>, {
+    clearable: boolean;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/components/SearchBar/ESearchBar.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,82 @@
+/* empty css                */
+import { useMessages as e } from "../../config.js";
+import { useFieldAttrs as t } from "../../composables/useFieldAttrs.js";
+import n from "../Icon/EIcon.js";
+/* empty css                 */
+import r from "../Button/EButton.js";
+import { createBlock as i, createCommentVNode as a, createElementBlock as o, createElementVNode as s, createTextVNode as c, createVNode as l, defineComponent as u, mergeModels as d, mergeProps as f, openBlock as p, ref as m, toDisplayString as h, unref as g, useModel as _, withCtx as v, withModifiers as y } from "vue";
+//#region src/components/SearchBar/ESearchBar.vue?vue&type=script&setup=true&lang.ts
+var b = ["aria-label"], x = { class: "e-search-lead" }, S = [
+	"name",
+	"aria-label",
+	"placeholder",
+	"value",
+	"disabled"
+], C = ["aria-label"], w = /*@__PURE__*/ u({
+	inheritAttrs: !1,
+	__name: "ESearchBar",
+	props: /*@__PURE__*/ d({
+		label: {},
+		placeholder: {},
+		action: {},
+		hideAction: { type: Boolean },
+		clearable: {
+			type: Boolean,
+			default: !0
+		},
+		name: {},
+		disabled: { type: Boolean }
+	}, {
+		modelValue: { default: "" },
+		modelModifiers: {}
+	}),
+	emits: /*@__PURE__*/ d(["submit"], ["update:modelValue"]),
+	setup(u, { expose: d, emit: w }) {
+		let T = w, E = _(u, "modelValue"), D = e(), O = t(), k = m(null);
+		function A() {
+			E.value = "", k.value?.focus();
+		}
+		return d({
+			input: k,
+			focus: () => k.value?.focus()
+		}), (e, t) => (p(), o("form", f({ class: "e-search" }, g(O).wrapper(), {
+			role: "search",
+			"aria-label": u.label || g(D)("search"),
+			onSubmit: t[2] ||= y((e) => T("submit", E.value), ["prevent"])
+		}), [
+			s("span", x, [l(n, { name: "search" })]),
+			s("input", f({
+				ref_key: "box",
+				ref: k
+			}, g(O).input(), {
+				class: "e-input",
+				name: u.name || "q",
+				"aria-label": u.label || g(D)("search"),
+				placeholder: u.placeholder || g(D)("search"),
+				value: E.value,
+				disabled: u.disabled,
+				onInput: t[0] ||= (e) => E.value = e.target.value
+			}), null, 16, S),
+			u.clearable && E.value && !u.disabled ? (p(), o("button", {
+				key: 0,
+				type: "button",
+				class: "e-search-clear",
+				"aria-label": g(D)("clear"),
+				onMousedown: t[1] ||= y(() => {}, ["prevent"]),
+				onClick: A
+			}, [l(n, { name: "x" })], 40, C)) : a("", !0),
+			u.hideAction ? a("", !0) : (p(), i(r, {
+				key: 1,
+				type: "submit",
+				disabled: u.disabled
+			}, {
+				default: v(() => [c(h(u.action || g(D)("search")), 1)]),
+				_: 1
+			}, 8, ["disabled"]))
+		], 16, b));
+	}
+});
+//#endregion
+export { w as default };
+
+//# sourceMappingURL=ESearchBar.vue_vue_type_script_setup_true_lang.js.map

package/dist/components/SearchBar/ESearchBar.vue_vue_type_script_setup_true_lang.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ESearchBar.vue_vue_type_script_setup_true_lang.js","names":["_useModel","_openBlock","_createElementBlock","_mergeProps","_unref","_withModifiers","_createElementVNode","_createVNode","EIcon","_createCommentVNode","_createBlock","EButton","_withCtx","_createTextVNode","_toDisplayString","EIcon_default","EButton_default","_hoisted_1","_hoisted_2","_hoisted_3","_hoisted_4","ESearchBar_vue_vue_type_script_setup_true_lang_default","\"modelValue\"","\"modelModifiers\"","__expose","__emit","emit","model","useModel","__props","t","useMessages","attrs","useFieldAttrs","box","ref","clear","openBlock","createElementBlock","mergeProps","unref","_cache","withModifiers","createElementVNode","createVNode","$event","createCommentVNode","createBlock","withCtx","createTextVNode","toDisplayString"],"sources":["../../../src/components/SearchBar/ESearchBar.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport EIcon from \"../Icon/EIcon.vue\";\nimport EButton from \"../Button/EButton.vue\";\nimport { ref } from \"vue\";\nimport { useMessages } from \"../../config.js\";\nimport { useFieldAttrs } from \"../../composables/useFieldAttrs.js\";\nimport \"../../styles/base.css\";\nimport \"../TextField/input.css\";\n\ndefineOptions({ inheritAttrs: false });\n\nwithDefaults(\n  defineProps<{\n    /** What screen readers call the box. Default \"Search\". */\n    label?: string;\n    /** Say what can be searched, briefly. Default \"Search\". */\n    placeholder?: string;\n    /** The text on the button. Default \"Search\". */\n    action?: string;\n    /** Leaves out the button, for a box that filters or searches as you type. Enter still submits. */\n    hideAction?: boolean;\n    /** The clear button, shown when there is text. On by default. */\n    clearable?: boolean;\n    /** The name submitted with a form. Default `q`. */\n    name?: string;\n    /** Search is unavailable. Say why in a Notice. */\n    disabled?: boolean;\n  }>(),\n  { clearable: true },\n);\n\nconst emit = defineEmits<{\n  /** The person pressed Enter or the button. */\n  submit: [value: string];\n}>();\n\nconst model = defineModel<string>({ default: \"\" });\n\nconst t = useMessages();\nconst attrs = useFieldAttrs();\nconst box = ref<HTMLInputElement | null>(null);\n\nfunction clear() {\n  model.value = \"\";\n  box.value?.focus();\n}\n\ndefineExpose({\n  input: box,\n  focus: () => box.value?.focus(),\n});\n</script>\n\n<template>\n  <form\n    class=\"e-search\"\n    v-bind=\"attrs.wrapper()\"\n    role=\"search\"\n    :aria-label=\"label || t('search')\"\n    @submit.prevent=\"emit('submit', model)\"\n  >\n    <span class=\"e-search-lead\"><EIcon name=\"search\" /></span>\n    <input\n      ref=\"box\"\n      v-bind=\"attrs.input()\"\n      class=\"e-input\"\n      :name=\"name || 'q'\"\n      :aria-label=\"label || t('search')\"\n      :placeholder=\"placeholder || t('search')\"\n      :value=\"model\"\n      :disabled=\"disabled\"\n      @input=\"model = ($event.target as HTMLInputElement).value\"\n    />\n    <button\n      v-if=\"clearable && model && !disabled\"\n      type=\"button\"\n      class=\"e-search-clear\"\n      :aria-label=\"t('clear')\"\n      @mousedown.prevent\n      @click=\"clear\"\n    >\n      <EIcon name=\"x\" />\n    </button>\n    <EButton v-if=\"!hideAction\" type=\"submit\" :disabled=\"disabled\">{{ action || t(\"search\") }}</EButton>\n  </form>\n</template>\n\n<style>\n@layer e.controls {\n  .e-search {\n    display: flex;\n    align-items: center;\n    gap: var(--e-space-1);\n    height: var(--e-control-height);\n    padding: 0 var(--e-space-1) 0 var(--e-space-2);\n    border: var(--e-stroke-edge) solid var(--e-border-strong);\n    border-radius: var(--e-radius-md);\n    background: var(--e-surface);\n    box-shadow: var(--e-well);\n    transition: border-color var(--e-duration-tap) var(--e-easing-out);\n  }\n\n  .e-search:hover {\n    border-color: var(--e-ink);\n  }\n\n  .e-search .e-btn {\n    position: relative;\n    height: calc(var(--e-control-height) - 6px);\n    padding: 0 var(--e-space-3);\n    font-size: var(--e-text-md);\n  }\n\n  .e-search .e-btn::after {\n    content: \"\";\n    position: absolute;\n    inset: -3px;\n  }\n\n  .e-search-clear {\n    display: inline-grid;\n    place-items: center;\n    position: relative;\n    flex: none;\n    width: calc(var(--e-control-height) - 9px);\n    height: calc(var(--e-control-height) - 9px);\n    padding: 0;\n    border: 0;\n    border-radius: var(--e-radius-sm);\n    background: transparent;\n    color: var(--e-ink);\n    cursor: pointer;\n    transition: background-color var(--e-duration-tap) var(--e-easing-out);\n  }\n\n  .e-search-clear::after {\n    content: \"\";\n    position: absolute;\n    inset: -5px;\n  }\n\n  .e-search-clear:hover {\n    background: var(--e-wash-hover);\n    box-shadow: inset 0 0 0 1px var(--e-wash-ring);\n  }\n\n  .e-search-clear:active {\n    background: var(--e-wash-press);\n    box-shadow: inset 0 0 0 1.5px var(--e-ink);\n  }\n\n  .e-search-clear:focus-visible {\n    outline: var(--e-stroke-focus) solid var(--e-focus-ring);\n    outline-offset: calc(-1 * var(--e-stroke-focus));\n  }\n\n  .e-search-lead {\n    display: grid;\n    place-items: center;\n    flex: none;\n    width: 28px;\n    color: var(--e-muted);\n  }\n\n  .e-search .e-input {\n    flex: 1;\n    text-overflow: ellipsis;\n    height: 100%;\n    border: 0;\n    background: transparent;\n    box-shadow: none;\n    font-size: var(--e-text-md);\n    padding-inline: var(--e-space-2);\n  }\n\n  .e-search .e-input:hover,\n  .e-search .e-input:focus {\n    border: 0;\n    background: transparent;\n  }\n\n  .e-search .e-input:focus-visible {\n    outline: none;\n  }\n\n  .e-search:focus-within {\n    border-color: var(--e-focus-field);\n    outline: var(--e-stroke-focus) solid var(--e-focus-field);\n    outline-offset: var(--e-focus-gap-field);\n  }\n\n  @media (prefers-reduced-motion: reduce) {\n    .e-search {\n      transition: none;\n    }\n  }\n\n  @media print {\n    .e-search {\n      display: none;\n    }\n  }\n}\n</style>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EA+BA,IAAM0B,IAAOD,GAKPE,IAAQ3B,EAAmB6B,GAAA,YAAgB,GAE3CC,IAAIC,EAAY,GAChBC,IAAQC,EAAc,GACtBC,IAAMC,EAA6B,IAAI;EAE7C,SAASC,IAAQ;GAEf,AADA,EAAM,QAAQ,IACdF,EAAI,OAAO,MAAM;EACnB;E,OAEAV,EAAa;GACX,OAAOU;GACP,aAAaA,EAAI,OAAO,MAAM;EAChC,CAAC,I,UAICjC,EAAA,GAAAC,EA8BO,QA9BPC,EA8BO,EA7BL,OAAM,WAAU,GACRC,EAAA4B,CAAA,CAAK,CAAC,QAAO,GAAA;GACrB,MAAK;GACJ,cAAYH,EAAA,SAASzB,EAAA0B,CAAA,CAAC,CAAA,QAAA;GACtB,UAAM,AAAAW,EAAA,OAAApC,GAAA,MAAUqB,EAAI,UAAWC,EAAA,KAAK,GAAA,CAAA,SAAA,CAAA;;GAErCrB,EAA0D,QAA1DY,GAA0D,CAA9BX,EAAuBC,GAAA,EAAhB,MAAK,SAAQ,CAAA,C;GAChDF,EAUE,SAVFH,EAUE;IATI,SAAA;IAAJ,KAAI+B;GACI,GAAA9B,EAAA4B,CAAA,CAAK,CAAC,MAAK,GAAA;IACnB,OAAM;IACL,MAAMH,EAAA,QAAI;IACV,cAAYA,EAAA,SAASzB,EAAA0B,CAAA,CAAC,CAAA,QAAA;IACtB,aAAaD,EAAA,eAAezB,EAAA0B,CAAA,CAAC,CAAA,QAAA;IAC7B,OAAOH,EAAA;IACP,UAAUE,EAAA;IACV,SAAK,AAAAY,EAAA,QAAA,MAAE,EAAA,QAASI,EAAO,OAA4B;;GAG9ChB,EAAA,aAAaF,EAAA,SAAK,CAAKE,EAAA,YAD/B5B,EAAA,GAAAC,EASS,UAAA;;IAPP,MAAK;IACL,OAAM;IACL,cAAYE,EAAA0B,CAAA,CAAC,CAAA,OAAA;IACb,aAAS,AAAAW,EAAA,OAAApC,QAAV,CAAA,GAAkB,CAAA,SAAA,CAAA;IACjB,SAAO+B;G,IAER7B,EAAkBC,GAAA,EAAX,MAAK,IAAG,CAAA,C;GAEDqB,EAAA,a,aAAhB5B,EAAA,GAAAS,EAAoGC,GAAA;;IAAxE,MAAK;IAAU,UAAUkB,EAAA;;IAAU,SAAAjB,QAA2B,CAAxBC,EAAAC,EAAAe,EAAA,UAAUzB,EAAA0B,CAAA,CAAC,CAAA,QAAA,CAAA,GAAA,CAAA,C"}

package/dist/components/SearchBar/index.d.ts

@@ -0,0 +1 @@
+export { default as ESearchBar } from './ESearchBar.vue.js';

package/dist/components/SearchResults/ESearchResults.js

@@ -0,0 +1,8 @@
+import e from "./ESearchResults.vue_vue_type_script_setup_true_lang.js";
+/* empty css                                               */
+//#region src/components/SearchResults/ESearchResults.vue
+var t = e;
+//#endregion
+export { t as default };
+
+//# sourceMappingURL=ESearchResults.js.map

package/dist/components/SearchResults/ESearchResults.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ESearchResults.js","names":["_sfc_main","ESearchResults_vue_vue_type_script_setup_true_lang_default","ESearchResults_default"],"sources":["../../../src/components/SearchResults/ESearchResults.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, ref, type Component } from \"vue\";\nimport EHighlight from \"../Combobox/EHighlight.js\";\nimport \"../../styles/base.css\";\nimport \"../Select/panel.css\";\n\nexport interface SearchResultItem {\n  /** The title of the result. */\n  label: string;\n  /** A muted line under the title, such as the section it belongs to. */\n  description?: string;\n  /** Where it goes. */\n  href?: string;\n  /** A router location, passed to `linkComponent` as `to` (for `RouterLink`). */\n  to?: unknown;\n}\n\nconst props = withDefaults(\n  defineProps<{\n    /** The results, best first. */\n    items: SearchResultItem[];\n    /** The accessible name of the list, such as \"Search results\". */\n    label: string;\n    /** Shown when there are no results, such as `Nothing found for \"tax\"`. Leave it out to show nothing at all, for example before anyone has typed. */\n    emptyText?: string;\n    /** The text that was searched for: its first match in each title and description is marked. */\n    query?: string;\n    /** What renders each link: `\"a\"` by default, or `RouterLink` (or any component that takes `href` or `to` and a default slot). */\n    linkComponent?: string | Component;\n  }>(),\n  { linkComponent: \"a\" },\n);\n\nconst emit = defineEmits<{\n  /** The person opened a result, by click or Enter. Call `event.preventDefault()` to handle the navigation yourself. */\n  select: [item: SearchResultItem, event: MouseEvent];\n  /** ArrowUp was pressed on the first result: move focus back to your search box. */\n  edge: [];\n}>();\n\nconst root = ref<HTMLElement | null>(null);\nconst needle = computed(() => (props.query ?? \"\").trim().toLowerCase());\n\nconst linkAttrs = (item: SearchResultItem) => (item.to !== undefined ? { to: item.to } : { href: item.href ?? \"#\" });\n\nconst links = () => [...(root.value?.querySelectorAll<HTMLElement>(\".e-opt\") ?? [])];\n\nfunction focusFirst() {\n  links()[0]?.focus();\n}\n\nfunction focus() {\n  const all = links();\n  (all.find((l) => l.contains(document.activeElement)) ?? all[0])?.focus();\n}\n\nfunction onKeydown(e: KeyboardEvent) {\n  if (e.key !== \"ArrowDown\" && e.key !== \"ArrowUp\") return;\n  const all = links();\n  const at = all.findIndex((l) => l === document.activeElement || l.contains(document.activeElement));\n  e.preventDefault();\n  if (e.key === \"ArrowDown\") all[Math.min(at + 1, all.length - 1)]?.focus();\n  else if (at <= 0) emit(\"edge\");\n  else all[at - 1]?.focus();\n}\n\nfunction onClick(item: SearchResultItem, e: MouseEvent) {\n  if (e.button !== 0 || e.ctrlKey || e.metaKey || e.shiftKey || e.altKey) return;\n  emit(\"select\", item, e);\n}\n\ndefineExpose({ focus, focusFirst });\n</script>\n\n<template>\n  <!-- eslint-disable-next-line vuejs-accessibility/no-static-element-interactions -->\n  <div v-if=\"items.length || emptyText\" ref=\"root\" class=\"e-results\" @keydown=\"onKeydown\">\n    <ul v-if=\"items.length\" class=\"e-results-list\" :aria-label=\"label\">\n      <li v-for=\"(item, i) in items\" :key=\"i\">\n        <component :is=\"linkComponent\" class=\"e-opt\" v-bind=\"linkAttrs(item)\" @click=\"onClick(item, $event)\">\n          <span class=\"e-opt-text\">\n            <span class=\"e-opt-label\"><EHighlight :text=\"item.label\" :query=\"needle\" /></span>\n            <span v-if=\"item.description\" class=\"e-opt-desc\">\n              <EHighlight :text=\"item.description\" :query=\"needle\" />\n            </span>\n          </span>\n        </component>\n      </li>\n    </ul>\n    <p v-else class=\"e-opt-status\">{{ emptyText }}</p>\n  </div>\n</template>\n\n<style>\n@layer e.controls {\n  .e-results {\n    max-height: min(24rem, 50vh);\n    min-height: 3rem;\n    overflow-y: auto;\n    padding: var(--e-space-1);\n    border-radius: var(--e-radius-md);\n    box-shadow: var(--e-edge);\n    color: var(--e-ink);\n  }\n\n  .e-results-list {\n    display: grid;\n    margin: 0;\n    padding: 0;\n    list-style: none;\n  }\n\n  .e-results .e-opt {\n    color: inherit;\n    text-decoration: none;\n  }\n\n  .e-results .e-opt:hover,\n  .e-results .e-opt:focus-visible {\n    background: var(--e-surface-tint);\n    box-shadow: inset 0 0 0 var(--e-stroke-hair) var(--e-border-strong);\n  }\n\n  .e-results .e-opt:focus-visible {\n    outline: var(--e-stroke-focus) solid var(--e-focus-ring);\n    outline-offset: calc(-1 * var(--e-stroke-focus));\n  }\n\n  @media (forced-colors: active) {\n    .e-results .e-opt:hover,\n    .e-results .e-opt:focus-visible {\n      forced-color-adjust: none;\n      background: Highlight;\n      color: HighlightText;\n    }\n  }\n}\n</style>\n"],"mappings":""}

package/dist/components/SearchResults/ESearchResults.vue.d.ts

@@ -0,0 +1,39 @@
+import { Component } from 'vue';
+export interface SearchResultItem {
+    /** The title of the result. */
+    label: string;
+    /** A muted line under the title, such as the section it belongs to. */
+    description?: string;
+    /** Where it goes. */
+    href?: string;
+    /** A router location, passed to `linkComponent` as `to` (for `RouterLink`). */
+    to?: unknown;
+}
+type __VLS_Props = {
+    /** The results, best first. */
+    items: SearchResultItem[];
+    /** The accessible name of the list, such as "Search results". */
+    label: string;
+    /** Shown when there are no results, such as `Nothing found for "tax"`. Leave it out to show nothing at all, for example before anyone has typed. */
+    emptyText?: string;
+    /** The text that was searched for: its first match in each title and description is marked. */
+    query?: string;
+    /** What renders each link: `"a"` by default, or `RouterLink` (or any component that takes `href` or `to` and a default slot). */
+    linkComponent?: string | Component;
+};
+declare function focusFirst(): void;
+declare function focus(): void;
+declare const __VLS_export: import('vue').DefineComponent<__VLS_Props, {
+    focus: typeof focus;
+    focusFirst: typeof focusFirst;
+}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    select: (item: SearchResultItem, event: MouseEvent) => any;
+    edge: () => any;
+}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{
+    onSelect?: ((item: SearchResultItem, event: MouseEvent) => any) | undefined;
+    onEdge?: (() => any) | undefined;
+}>, {
+    linkComponent: string | Component;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/components/SearchResults/ESearchResults.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,67 @@
+/* empty css                */
+/* empty css              */
+import e from "../Combobox/EHighlight.js";
+import { Fragment as t, computed as n, createBlock as r, createCommentVNode as i, createElementBlock as a, createElementVNode as o, createVNode as s, defineComponent as c, mergeProps as l, openBlock as u, ref as d, renderList as f, resolveDynamicComponent as p, toDisplayString as m, unref as h, withCtx as g } from "vue";
+//#region src/components/SearchResults/ESearchResults.vue?vue&type=script&setup=true&lang.ts
+var _ = ["aria-label"], v = { class: "e-opt-text" }, y = { class: "e-opt-label" }, b = {
+	key: 0,
+	class: "e-opt-desc"
+}, x = {
+	key: 1,
+	class: "e-opt-status"
+}, S = /*@__PURE__*/ c({
+	__name: "ESearchResults",
+	props: {
+		items: {},
+		label: {},
+		emptyText: {},
+		query: {},
+		linkComponent: { default: "a" }
+	},
+	emits: ["select", "edge"],
+	setup(c, { expose: S, emit: C }) {
+		let w = c, T = C, E = d(null), D = n(() => (w.query ?? "").trim().toLowerCase()), O = (e) => e.to === void 0 ? { href: e.href ?? "#" } : { to: e.to }, k = () => [...E.value?.querySelectorAll(".e-opt") ?? []];
+		function A() {
+			k()[0]?.focus();
+		}
+		function j() {
+			let e = k();
+			(e.find((e) => e.contains(document.activeElement)) ?? e[0])?.focus();
+		}
+		function M(e) {
+			if (e.key !== "ArrowDown" && e.key !== "ArrowUp") return;
+			let t = k(), n = t.findIndex((e) => e === document.activeElement || e.contains(document.activeElement));
+			e.preventDefault(), e.key === "ArrowDown" ? t[Math.min(n + 1, t.length - 1)]?.focus() : n <= 0 ? T("edge") : t[n - 1]?.focus();
+		}
+		function N(e, t) {
+			t.button !== 0 || t.ctrlKey || t.metaKey || t.shiftKey || t.altKey || T("select", e, t);
+		}
+		return S({
+			focus: j,
+			focusFirst: A
+		}), (n, d) => c.items.length || c.emptyText ? (u(), a("div", {
+			key: 0,
+			ref_key: "root",
+			ref: E,
+			class: "e-results",
+			onKeydown: M
+		}, [c.items.length ? (u(), a("ul", {
+			key: 0,
+			class: "e-results-list",
+			"aria-label": c.label
+		}, [(u(!0), a(t, null, f(c.items, (t, n) => (u(), a("li", { key: n }, [(u(), r(p(c.linkComponent), l({ class: "e-opt" }, { ref_for: !0 }, O(t), { onClick: (e) => N(t, e) }), {
+			default: g(() => [o("span", v, [o("span", y, [s(h(e), {
+				text: t.label,
+				query: D.value
+			}, null, 8, ["text", "query"])]), t.description ? (u(), a("span", b, [s(h(e), {
+				text: t.description,
+				query: D.value
+			}, null, 8, ["text", "query"])])) : i("", !0)])]),
+			_: 2
+		}, 1040, ["onClick"]))]))), 128))], 8, _)) : (u(), a("p", x, m(c.emptyText), 1))], 544)) : i("", !0);
+	}
+});
+//#endregion
+export { S as default };
+
+//# sourceMappingURL=ESearchResults.vue_vue_type_script_setup_true_lang.js.map