@alfakit/vue 0.0.0-stage → 0.1.0

package/dist/components/fields/ModalTablePicker.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,330 @@
+import { useChoice as e, useT as t } from "../../context.js";
+import { cn as n } from "../../lib/utils.js";
+import r from "../ui/Button2.js";
+import { useFormStore as ee } from "../form/form-context.js";
+import te from "../ui/Checkbox.js";
+import ne from "../ui/Input.js";
+import re from "../ui/Table.js";
+import ie from "../ui/TableBody.js";
+import i from "../ui/TableCell.js";
+import a from "../ui/TableHead.js";
+import ae from "../ui/TableHeader.js";
+import o from "../ui/TableRow.js";
+import oe from "../ui/Dialog.js";
+import se from "../ui/DialogContent.js";
+import ce from "../ui/DialogDescription.js";
+import le from "../ui/DialogHeader.js";
+import ue from "../ui/DialogTitle.js";
+import de from "../table/TableCellContent.js";
+import fe from "../ui/DialogFooter.js";
+import s from "../ui/Skeleton.js";
+import pe from "./ModalTablePickerFilters.js";
+import { FILTERS_MODAL_WIDTH_CLASSES as me, debounce as he, modalTablePaging as ge, toggleModalTableKey as _e } from "@alfakit/core";
+import { Fragment as c, computed as l, createBlock as u, createCommentVNode as d, createElementBlock as f, createElementVNode as p, createTextVNode as m, createVNode as h, defineComponent as g, normalizeClass as _, onScopeDispose as v, openBlock as y, ref as b, renderList as x, toDisplayString as S, unref as C, watch as ve, withCtx as w, withModifiers as ye } from "vue";
+import { ArrowDownIcon as be, ArrowUpDownIcon as xe, ArrowUpIcon as Se, ChevronLeftIcon as T, ChevronRightIcon as Ce, SearchIcon as we } from "@lucide/vue";
+//#region src/components/fields/ModalTablePicker.vue?vue&type=script&setup=true&lang.ts
+var E = ["innerHTML"], D = {
+	key: 0,
+	class: "flex flex-col gap-3"
+}, O = {
+	key: 0,
+	class: "relative"
+}, k = ["aria-busy"], Te = {
+	key: 0,
+	role: "alert",
+	class: "text-destructive p-6 text-center text-sm"
+}, Ee = {
+	key: 1,
+	class: "flex flex-col gap-2 p-4",
+	"aria-hidden": "true"
+}, De = {
+	key: 2,
+	class: "text-muted-foreground p-6 text-center text-sm"
+}, Oe = { class: "sr-only" }, ke = ["onClick"], Ae = [
+	"name",
+	"checked",
+	"disabled",
+	"aria-label",
+	"onChange"
+], je = {
+	key: 1,
+	class: "text-muted-foreground text-sm",
+	role: "status"
+}, Me = ["aria-label"], Ne = { class: "text-muted-foreground text-sm" }, Pe = { key: 1 }, Fe = { class: "flex gap-2" }, A = /*@__PURE__*/ g({
+	__name: "ModalTablePicker",
+	props: {
+		component: {},
+		initial: {}
+	},
+	emits: ["close", "confirm"],
+	setup(g, { emit: A }) {
+		let j = g, M = A, N = t(), P = e(), F = ee(), I = l(() => !!j.component.multiple), L = b({}), R = b(null), z = b(!1), B = b(!0), V = b([...j.initial]), H = b({}), U = b(""), W = null;
+		ve(L, () => {
+			W?.abort();
+			let e = new AbortController();
+			W = e, B.value = !0, F.modalTable(j.component.statePath, j.component.tableStateIdentifier, L.value, e.signal).then((e) => {
+				e && (R.value = e, H.value = {
+					...H.value,
+					...e.labels
+				}, z.value = !1);
+			}).catch((e) => {
+				e.name !== "AbortError" && (z.value = !0);
+			}).finally(() => {
+				e.signal.aborted || (B.value = !1);
+			});
+		}, {
+			immediate: !0,
+			deep: !0
+		}), v(() => W?.abort());
+		let G = l(() => R.value?.table), K = he((e) => {
+			L.value = {
+				...L.value,
+				search: e || null,
+				page: null
+			};
+		}, 400);
+		v(() => K.cancel());
+		let q = l(() => G.value ? G.value.columns.filter((e) => G.value.visibleColumns.includes(e.name)) : []), J = l(() => G.value?.records ?? []), Y = l(() => ge(G.value?.pagination)), X = l(() => I.value && j.component.maxItems != null && V.value.length >= j.component.maxItems), Ie = l(() => !!G.value?.searchable || (G.value?.filters?.length ?? 0) > 0), Z = (e) => {
+			V.value = _e(V.value, e, I.value, j.component.maxItems);
+		}, Q = (e, t) => t === !0 && (V.value.includes(e) || !X.value), Le = (e) => {
+			let t = G.value?.sort?.column === e && G.value.sort.direction === "asc" ? "desc" : "asc";
+			L.value = {
+				...L.value,
+				sort: e,
+				direction: t,
+				page: null
+			};
+		}, Re = (e) => G.value?.sort?.column === e ? G.value.sort.direction === "asc" ? "ascending" : "descending" : void 0, $ = (e) => {
+			L.value = {
+				...L.value,
+				page: e
+			};
+		}, ze = () => M("confirm", V.value, Object.fromEntries(V.value.filter((e) => H.value[e]).map((e) => [e, H.value[e]])));
+		return (e, t) => (y(), u(oe, {
+			open: !0,
+			"onUpdate:open": t[7] ||= (e) => !e && M("close")
+		}, {
+			default: w(() => [h(se, {
+				class: _(C(n)("flex max-h-[90vh] flex-col gap-4", C(me)[j.component.modalWidth ?? "3xl"] ?? "sm:max-w-3xl")),
+				"data-slot": "modal-table-select-dialog"
+			}, {
+				default: w(() => [
+					h(le, null, {
+						default: w(() => [
+							h(ue, null, {
+								default: w(() => [m(S(j.component.modalHeading), 1)]),
+								_: 1
+							}),
+							j.component.modalDescription ? (y(), f("p", {
+								key: 0,
+								class: "text-muted-foreground text-sm",
+								"data-slot": "modal-table-select-description",
+								innerHTML: j.component.modalDescription
+							}, null, 8, E)) : d("", !0),
+							h(ce, { "aria-live": "polite" }, {
+								default: w(() => [m(S(C(P)("table.selected", V.value.length, { count: V.value.length }, ":count selected")), 1)]),
+								_: 1
+							})
+						]),
+						_: 1
+					}),
+					G.value && Ie.value ? (y(), f("div", D, [G.value.searchable ? (y(), f("div", O, [h(C(we), { class: "text-muted-foreground pointer-events-none absolute start-2.5 top-1/2 size-4 -translate-y-1/2" }), h(ne, {
+						type: "search",
+						"model-value": U.value,
+						"aria-label": G.value.searchPlaceholder,
+						placeholder: G.value.searchPlaceholder,
+						class: "ps-8",
+						"onUpdate:modelValue": t[0] ||= (e) => {
+							U.value = String(e), C(K)(String(e));
+						}
+					}, null, 8, [
+						"model-value",
+						"aria-label",
+						"placeholder"
+					])])) : d("", !0), (G.value.filters?.length ?? 0) > 0 ? (y(), u(pe, {
+						key: 1,
+						table: G.value,
+						owner: C(F),
+						path: j.component.statePath,
+						onChange: t[1] ||= (e) => L.value = {
+							...L.value,
+							filters: e,
+							page: null
+						}
+					}, null, 8, [
+						"table",
+						"owner",
+						"path"
+					])) : d("", !0)])) : d("", !0),
+					p("div", {
+						class: "min-h-0 flex-1 overflow-auto rounded-md border",
+						"aria-busy": B.value
+					}, [z.value ? (y(), f("p", Te, S(C(N)("table_select.load_failed", {}, "Couldn't load the records.")), 1)) : G.value ? J.value.length === 0 ? (y(), f("p", De, S(G.value.emptyState.heading), 1)) : (y(), u(re, {
+						key: 3,
+						class: _(C(n)(B.value && "opacity-60"))
+					}, {
+						default: w(() => [h(ae, null, {
+							default: w(() => [h(o, null, {
+								default: w(() => [h(a, { class: "w-10" }, {
+									default: w(() => [p("span", Oe, S(C(N)("table.select_row", {}, "Select row")), 1)]),
+									_: 1
+								}), (y(!0), f(c, null, x(q.value, (e) => (y(), u(a, {
+									key: e.name,
+									"aria-sort": Re(e.name)
+								}, {
+									default: w(() => [e.sortable ? (y(), f("button", {
+										key: 0,
+										type: "button",
+										class: "inline-flex items-center gap-1",
+										onClick: (t) => Le(e.name)
+									}, [m(S(e.label) + " ", 1), G.value.sort?.column === e.name ? (y(), f(c, { key: 0 }, [G.value.sort.direction === "asc" ? (y(), u(C(Se), {
+										key: 0,
+										class: "size-3.5"
+									})) : (y(), u(C(be), {
+										key: 1,
+										class: "size-3.5"
+									}))], 64)) : (y(), u(C(xe), {
+										key: 1,
+										class: "text-muted-foreground size-3.5"
+									}))], 8, ke)) : (y(), f(c, { key: 1 }, [m(S(e.label), 1)], 64))]),
+									_: 2
+								}, 1032, ["aria-sort"]))), 128))]),
+								_: 1
+							})]),
+							_: 1
+						}), h(ie, null, {
+							default: w(() => [(y(!0), f(c, null, x(J.value, (e) => (y(), u(o, {
+								key: String(e.key),
+								"data-state": V.value.includes(String(e.key)) ? "selected" : void 0,
+								class: _(C(n)(Q(String(e.key), e.selectable) && "cursor-pointer")),
+								onClick: (t) => Q(String(e.key), e.selectable) && Z(String(e.key))
+							}, {
+								default: w(() => [h(i, {
+									class: "w-10",
+									onClick: t[2] ||= ye(() => {}, ["stop"])
+								}, {
+									default: w(() => [I.value ? (y(), u(te, {
+										key: 0,
+										"model-value": V.value.includes(String(e.key)),
+										disabled: !Q(String(e.key), e.selectable),
+										"aria-label": C(N)("table_select.select_record", { label: H.value[String(e.key)] ?? String(e.key) }, "Select :label"),
+										"onUpdate:modelValue": (t) => Z(String(e.key))
+									}, null, 8, [
+										"model-value",
+										"disabled",
+										"aria-label",
+										"onUpdate:modelValue"
+									])) : (y(), f("input", {
+										key: 1,
+										type: "radio",
+										name: `${j.component.statePath}-picker`,
+										class: "accent-primary size-4",
+										checked: V.value.includes(String(e.key)),
+										disabled: !Q(String(e.key), e.selectable),
+										"aria-label": C(N)("table_select.select_record", { label: H.value[String(e.key)] ?? String(e.key) }, "Select :label"),
+										onChange: (t) => Z(String(e.key))
+									}, null, 40, Ae))]),
+									_: 2
+								}, 1024), (y(!0), f(c, null, x(q.value, (t) => (y(), u(i, { key: t.name }, {
+									default: w(() => [e.cells[t.name] ? (y(), u(de, {
+										key: 0,
+										column: t,
+										cell: e.cells[t.name],
+										"record-key": e.key,
+										token: "",
+										component: `picker:${j.component.statePath}`
+									}, null, 8, [
+										"column",
+										"cell",
+										"record-key",
+										"component"
+									])) : d("", !0)]),
+									_: 2
+								}, 1024))), 128))]),
+								_: 2
+							}, 1032, [
+								"data-state",
+								"class",
+								"onClick"
+							]))), 128))]),
+							_: 1
+						})]),
+						_: 1
+					}, 8, ["class"])) : (y(), f("div", Ee, [
+						h(s, { class: "h-8 w-full" }),
+						h(s, { class: "h-8 w-full" }),
+						h(s, { class: "h-8 w-full" })
+					]))], 8, k),
+					X.value ? (y(), f("p", je, S(C(P)("table_select.max_reached", j.component.maxItems ?? 0, { count: j.component.maxItems ?? 0 }, "You can select up to :count records.")), 1)) : d("", !0),
+					h(fe, { class: "items-center sm:justify-between" }, {
+						default: w(() => [Y.value ? (y(), f("nav", {
+							key: 0,
+							class: "flex items-center gap-2",
+							"aria-label": C(N)("pagination", {}, "Pagination")
+						}, [
+							h(r, {
+								type: "button",
+								variant: "outline",
+								size: "icon-sm",
+								disabled: !Y.value.hasPrevious || B.value,
+								"aria-label": C(N)("table.previous", {}, "Previous"),
+								onClick: t[3] ||= (e) => $(Y.value.page - 1)
+							}, {
+								default: w(() => [h(C(T), { class: "rtl:rotate-180" })]),
+								_: 1
+							}, 8, ["disabled", "aria-label"]),
+							p("span", Ne, S(Y.value.total === void 0 ? `${Y.value.from}–${Y.value.to}` : C(N)("table.showing", {
+								first: Y.value.from,
+								last: Y.value.to,
+								total: Y.value.total
+							}, "Showing :first–:last of :total")), 1),
+							h(r, {
+								type: "button",
+								variant: "outline",
+								size: "icon-sm",
+								disabled: !Y.value.hasNext || B.value,
+								"aria-label": C(N)("table.next", {}, "Next"),
+								onClick: t[4] ||= (e) => $(Y.value.page + 1)
+							}, {
+								default: w(() => [h(C(Ce), { class: "rtl:rotate-180" })]),
+								_: 1
+							}, 8, ["disabled", "aria-label"])
+						], 8, Me)) : (y(), f("span", Pe)), p("div", Fe, [
+							V.value.length > 0 ? (y(), u(r, {
+								key: 0,
+								type: "button",
+								variant: "ghost",
+								onClick: t[5] ||= (e) => V.value = []
+							}, {
+								default: w(() => [m(S(C(N)("table_select.clear", {}, "Clear selection")), 1)]),
+								_: 1
+							})) : d("", !0),
+							h(r, {
+								type: "button",
+								variant: "outline",
+								onClick: t[6] ||= (e) => M("close")
+							}, {
+								default: w(() => [m(S(C(N)("cancel", {}, "Cancel")), 1)]),
+								_: 1
+							}),
+							h(r, {
+								type: "button",
+								onClick: ze
+							}, {
+								default: w(() => [m(S(j.component.modalSubmitActionLabel ?? C(N)("table_select.confirm", {}, "Select")), 1)]),
+								_: 1
+							})
+						])]),
+						_: 1
+					})
+				]),
+				_: 1
+			}, 8, ["class"])]),
+			_: 1
+		}));
+	}
+});
+//#endregion
+export { A as default };
+
+//# sourceMappingURL=ModalTablePicker.vue_vue_type_script_setup_true_lang.js.map

package/dist/components/fields/ModalTablePicker.vue_vue_type_script_setup_true_lang.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ModalTablePicker.vue_vue_type_script_setup_true_lang.js","names":["_openBlock","_createBlock","Dialog","_withCtx","_createVNode","DialogContent","_normalizeClass","_unref","DialogHeader","DialogTitle","_createTextVNode","_toDisplayString","_createElementBlock","_createCommentVNode","DialogDescription","Input","ModalTablePickerFilters","_createElementVNode","Skeleton","Table","TableHeader","TableRow","TableHead","_Fragment","_renderList","TableBody","TableCell","_withModifiers","Checkbox","TableCellContent","DialogFooter","Button","Button_default","Checkbox_default","Input_default","Table_default","TableBody_default","TableCell_default","TableHead_default","TableHeader_default","TableRow_default","Dialog_default","DialogContent_default","DialogDescription_default","DialogHeader_default","DialogTitle_default","TableCellContent_default","DialogFooter_default","Skeleton_default","ModalTablePickerFilters_default","_hoisted_1","_hoisted_2","_hoisted_3","_hoisted_4","_hoisted_5","_hoisted_6","_hoisted_7","_hoisted_8","_hoisted_9","_hoisted_10","_hoisted_11","_hoisted_12","_hoisted_13","_hoisted_14","_hoisted_15","ModalTablePicker_vue_vue_type_script_setup_true_lang_default","__emit","props","__props","emit","t","useT","choice","useChoice","form","useFormStore","multiple","computed","query","ref","response","failed","loading","draft","labels","search","controller","watch","current","next","error","onScopeDispose","table","pushSearch","debounce","columns","column","records","paging","modalTablePaging","atMax","hasToolbar","toggle","toggleModalTableKey","key","isSelectable","selectable","sort","direction","ariaSortOf","goTo","confirm","openBlock","createBlock","_cache","open","withCtx","createVNode","normalizeClass","unref","cn","FILTERS_MODAL_WIDTH_CLASSES","createTextVNode","toDisplayString","createElementBlock","createCommentVNode","SearchIcon","createElementVNode","Fragment","renderList","ArrowUpIcon","ArrowDownIcon","ArrowUpDownIcon","record","withModifiers","ChevronLeftIcon","ChevronRightIcon"],"sources":["../../../src/components/fields/ModalTablePicker.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { ModalTableSelectResponse, ModalTableSelectSchema, TableQuery } from '@alfakit/core'\nimport {\n  FILTERS_MODAL_WIDTH_CLASSES,\n  debounce,\n  modalTablePaging,\n  toggleModalTableKey,\n} from '@alfakit/core'\nimport {\n  ArrowDownIcon,\n  ArrowUpDownIcon,\n  ArrowUpIcon,\n  ChevronLeftIcon,\n  ChevronRightIcon,\n  SearchIcon,\n} from '@lucide/vue'\nimport { computed, onScopeDispose, ref, watch } from 'vue'\nimport { useChoice, useT } from '../../context'\nimport { cn } from '../../lib/utils'\nimport { useFormStore } from '../form/form-context'\nimport TableCellContent from '../table/TableCellContent.vue'\nimport Button from '../ui/Button.vue'\nimport Checkbox from '../ui/Checkbox.vue'\nimport Dialog from '../ui/Dialog.vue'\nimport DialogContent from '../ui/DialogContent.vue'\nimport DialogDescription from '../ui/DialogDescription.vue'\nimport DialogFooter from '../ui/DialogFooter.vue'\nimport DialogHeader from '../ui/DialogHeader.vue'\nimport DialogTitle from '../ui/DialogTitle.vue'\nimport Input from '../ui/Input.vue'\nimport Skeleton from '../ui/Skeleton.vue'\nimport Table from '../ui/Table.vue'\nimport TableBody from '../ui/TableBody.vue'\nimport TableCell from '../ui/TableCell.vue'\nimport TableHead from '../ui/TableHead.vue'\nimport TableHeader from '../ui/TableHeader.vue'\nimport TableRow from '../ui/TableRow.vue'\nimport ModalTablePickerFilters from './ModalTablePickerFilters.vue'\n\nconst props = defineProps<{ component: ModalTableSelectSchema; initial: string[] }>()\nconst emit = defineEmits<{\n  close: []\n  confirm: [keys: string[], labels: Record<string, string>]\n}>()\nconst t = useT()\nconst choice = useChoice()\nconst form = useFormStore()\nconst multiple = computed(() => Boolean(props.component.multiple))\nconst query = ref<TableQuery>({})\nconst response = ref<ModalTableSelectResponse | null>(null)\nconst failed = ref(false)\nconst loading = ref(true)\nconst draft = ref<string[]>([...props.initial])\nconst labels = ref<Record<string, string>>({})\nconst search = ref('')\nlet controller: AbortController | null = null\n\nconst load = () => {\n  controller?.abort()\n  const current = new AbortController()\n  controller = current\n  loading.value = true\n\n  form\n    .modalTable(\n      props.component.statePath,\n      props.component.tableStateIdentifier,\n      query.value,\n      current.signal,\n    )\n    .then((next) => {\n      if (!next) return\n      response.value = next\n      labels.value = { ...labels.value, ...next.labels }\n      failed.value = false\n    })\n    .catch((error: unknown) => {\n      if ((error as { name?: string }).name !== 'AbortError') failed.value = true\n    })\n    .finally(() => {\n      if (!current.signal.aborted) loading.value = false\n    })\n}\n\nwatch(query, load, { immediate: true, deep: true })\nonScopeDispose(() => controller?.abort())\n\nconst table = computed(() => response.value?.table)\nconst pushSearch = debounce((next: string) => {\n  query.value = { ...query.value, search: next || null, page: null }\n}, 400)\nonScopeDispose(() => pushSearch.cancel())\n\nconst columns = computed(() =>\n  table.value\n    ? table.value.columns.filter((column) => table.value!.visibleColumns.includes(column.name))\n    : [],\n)\nconst records = computed(() => table.value?.records ?? [])\nconst paging = computed(() => modalTablePaging(table.value?.pagination))\nconst atMax = computed(\n  () =>\n    multiple.value &&\n    props.component.maxItems != null &&\n    draft.value.length >= props.component.maxItems,\n)\nconst hasToolbar = computed(\n  () => Boolean(table.value?.searchable) || (table.value?.filters?.length ?? 0) > 0,\n)\n\nconst toggle = (key: string) => {\n  draft.value = toggleModalTableKey(draft.value, key, multiple.value, props.component.maxItems)\n}\nconst isSelectable = (key: string, selectable: boolean | undefined) =>\n  selectable === true && (draft.value.includes(key) || !atMax.value)\nconst sort = (column: string) => {\n  const direction =\n    table.value?.sort?.column === column && table.value.sort.direction === 'asc' ? 'desc' : 'asc'\n  query.value = { ...query.value, sort: column, direction, page: null }\n}\nconst ariaSortOf = (column: string) =>\n  table.value?.sort?.column === column\n    ? table.value.sort.direction === 'asc'\n      ? 'ascending'\n      : 'descending'\n    : undefined\nconst goTo = (page: number) => {\n  query.value = { ...query.value, page }\n}\nconst confirm = () =>\n  emit(\n    'confirm',\n    draft.value,\n    Object.fromEntries(\n      draft.value.filter((key) => labels.value[key]).map((key) => [key, labels.value[key]!]),\n    ),\n  )\n</script>\n\n<template>\n  <Dialog :open=\"true\" @update:open=\"(open) => !open && emit('close')\">\n    <DialogContent\n      :class=\"\n        cn(\n          'flex max-h-[90vh] flex-col gap-4',\n          FILTERS_MODAL_WIDTH_CLASSES[props.component.modalWidth ?? '3xl'] ?? 'sm:max-w-3xl',\n        )\n      \"\n      data-slot=\"modal-table-select-dialog\"\n    >\n      <DialogHeader>\n        <DialogTitle>{{ props.component.modalHeading }}</DialogTitle>\n        <!-- Escaped on the server (`Html::from()`), like action modal descriptions. -->\n        <p\n          v-if=\"props.component.modalDescription\"\n          class=\"text-muted-foreground text-sm\"\n          data-slot=\"modal-table-select-description\"\n          v-html=\"props.component.modalDescription\"\n        />\n        <DialogDescription aria-live=\"polite\">{{\n          choice('table.selected', draft.length, { count: draft.length }, ':count selected')\n        }}</DialogDescription>\n      </DialogHeader>\n      <div v-if=\"table && hasToolbar\" class=\"flex flex-col gap-3\">\n        <div v-if=\"table.searchable\" class=\"relative\">\n          <SearchIcon\n            class=\"text-muted-foreground pointer-events-none absolute start-2.5 top-1/2 size-4 -translate-y-1/2\"\n          />\n          <Input\n            type=\"search\"\n            :model-value=\"search\"\n            :aria-label=\"table.searchPlaceholder\"\n            :placeholder=\"table.searchPlaceholder\"\n            class=\"ps-8\"\n            @update:model-value=\"\n              (next) => {\n                search = String(next)\n                pushSearch(String(next))\n              }\n            \"\n          />\n        </div>\n        <ModalTablePickerFilters\n          v-if=\"(table.filters?.length ?? 0) > 0\"\n          :table=\"table\"\n          :owner=\"form\"\n          :path=\"props.component.statePath\"\n          @change=\"(filters) => (query = { ...query, filters, page: null })\"\n        />\n      </div>\n      <div class=\"min-h-0 flex-1 overflow-auto rounded-md border\" :aria-busy=\"loading\">\n        <p v-if=\"failed\" role=\"alert\" class=\"text-destructive p-6 text-center text-sm\">\n          {{ t('table_select.load_failed', {}, \"Couldn't load the records.\") }}\n        </p>\n        <div v-else-if=\"!table\" class=\"flex flex-col gap-2 p-4\" aria-hidden=\"true\">\n          <Skeleton class=\"h-8 w-full\" />\n          <Skeleton class=\"h-8 w-full\" />\n          <Skeleton class=\"h-8 w-full\" />\n        </div>\n        <p v-else-if=\"records.length === 0\" class=\"text-muted-foreground p-6 text-center text-sm\">\n          {{ table.emptyState.heading }}\n        </p>\n        <Table v-else :class=\"cn(loading && 'opacity-60')\">\n          <TableHeader>\n            <TableRow>\n              <TableHead class=\"w-10\"\n                ><span class=\"sr-only\">{{\n                  t('table.select_row', {}, 'Select row')\n                }}</span></TableHead\n              >\n              <TableHead\n                v-for=\"column in columns\"\n                :key=\"column.name\"\n                :aria-sort=\"ariaSortOf(column.name)\"\n              >\n                <button\n                  v-if=\"column.sortable\"\n                  type=\"button\"\n                  class=\"inline-flex items-center gap-1\"\n                  @click=\"sort(column.name)\"\n                >\n                  {{ column.label }}\n                  <template v-if=\"table.sort?.column === column.name\">\n                    <ArrowUpIcon v-if=\"table.sort.direction === 'asc'\" class=\"size-3.5\" />\n                    <ArrowDownIcon v-else class=\"size-3.5\" />\n                  </template>\n                  <ArrowUpDownIcon v-else class=\"text-muted-foreground size-3.5\" />\n                </button>\n                <template v-else>{{ column.label }}</template>\n              </TableHead>\n            </TableRow>\n          </TableHeader>\n          <TableBody>\n            <TableRow\n              v-for=\"record in records\"\n              :key=\"String(record.key)\"\n              :data-state=\"draft.includes(String(record.key)) ? 'selected' : undefined\"\n              :class=\"cn(isSelectable(String(record.key), record.selectable) && 'cursor-pointer')\"\n              @click=\"\n                isSelectable(String(record.key), record.selectable) && toggle(String(record.key))\n              \"\n            >\n              <TableCell class=\"w-10\" @click.stop>\n                <Checkbox\n                  v-if=\"multiple\"\n                  :model-value=\"draft.includes(String(record.key))\"\n                  :disabled=\"!isSelectable(String(record.key), record.selectable)\"\n                  :aria-label=\"\n                    t(\n                      'table_select.select_record',\n                      { label: labels[String(record.key)] ?? String(record.key) },\n                      'Select :label',\n                    )\n                  \"\n                  @update:model-value=\"toggle(String(record.key))\"\n                />\n                <input\n                  v-else\n                  type=\"radio\"\n                  :name=\"`${props.component.statePath}-picker`\"\n                  class=\"accent-primary size-4\"\n                  :checked=\"draft.includes(String(record.key))\"\n                  :disabled=\"!isSelectable(String(record.key), record.selectable)\"\n                  :aria-label=\"\n                    t(\n                      'table_select.select_record',\n                      { label: labels[String(record.key)] ?? String(record.key) },\n                      'Select :label',\n                    )\n                  \"\n                  @change=\"toggle(String(record.key))\"\n                />\n              </TableCell>\n              <TableCell v-for=\"column in columns\" :key=\"column.name\">\n                <TableCellContent\n                  v-if=\"record.cells[column.name]\"\n                  :column=\"column\"\n                  :cell=\"record.cells[column.name]!\"\n                  :record-key=\"record.key\"\n                  token=\"\"\n                  :component=\"`picker:${props.component.statePath}`\"\n                />\n              </TableCell>\n            </TableRow>\n          </TableBody>\n        </Table>\n      </div>\n      <p v-if=\"atMax\" class=\"text-muted-foreground text-sm\" role=\"status\">\n        {{\n          choice(\n            'table_select.max_reached',\n            props.component.maxItems ?? 0,\n            { count: props.component.maxItems ?? 0 },\n            'You can select up to :count records.',\n          )\n        }}\n      </p>\n      <DialogFooter class=\"items-center sm:justify-between\">\n        <nav\n          v-if=\"paging\"\n          class=\"flex items-center gap-2\"\n          :aria-label=\"t('pagination', {}, 'Pagination')\"\n        >\n          <Button\n            type=\"button\"\n            variant=\"outline\"\n            size=\"icon-sm\"\n            :disabled=\"!paging.hasPrevious || loading\"\n            :aria-label=\"t('table.previous', {}, 'Previous')\"\n            @click=\"goTo(paging.page - 1)\"\n            ><ChevronLeftIcon class=\"rtl:rotate-180\"\n          /></Button>\n          <span class=\"text-muted-foreground text-sm\">{{\n            paging.total !== undefined\n              ? t(\n                  'table.showing',\n                  { first: paging.from, last: paging.to, total: paging.total },\n                  'Showing :first–:last of :total',\n                )\n              : `${paging.from}–${paging.to}`\n          }}</span>\n          <Button\n            type=\"button\"\n            variant=\"outline\"\n            size=\"icon-sm\"\n            :disabled=\"!paging.hasNext || loading\"\n            :aria-label=\"t('table.next', {}, 'Next')\"\n            @click=\"goTo(paging.page + 1)\"\n            ><ChevronRightIcon class=\"rtl:rotate-180\"\n          /></Button>\n        </nav>\n        <span v-else />\n        <div class=\"flex gap-2\">\n          <Button v-if=\"draft.length > 0\" type=\"button\" variant=\"ghost\" @click=\"draft = []\">{{\n            t('table_select.clear', {}, 'Clear selection')\n          }}</Button>\n          <Button type=\"button\" variant=\"outline\" @click=\"emit('close')\">{{\n            t('cancel', {}, 'Cancel')\n          }}</Button>\n          <Button type=\"button\" @click=\"confirm\">{{\n            props.component.modalSubmitActionLabel ?? t('table_select.confirm', {}, 'Select')\n          }}</Button>\n        </div>\n      </DialogFooter>\n    </DialogContent>\n  </Dialog>\n</template>\n"],"mappings":"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"}

package/dist/components/fields/ModalTablePickerFilters.js

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

package/dist/components/fields/ModalTablePickerFilters.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ModalTablePickerFilters.js","names":["_sfc_main","ModalTablePickerFilters_vue_vue_type_script_setup_true_lang_default","ModalTablePickerFilters_default"],"sources":["../../../src/components/fields/ModalTablePickerFilters.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { TableSchema } from '@alfakit/core'\nimport { FormStore, filterFormComponents, pickerFilterFormOptions } from '@alfakit/core'\nimport { computed, onScopeDispose, watch } from 'vue'\nimport { useStore } from '../../composables/use-store'\nimport { useT } from '../../context'\nimport { provideForm } from '../form/form-context'\nimport SchemaRenderer from '../schema/SchemaRenderer.vue'\nimport Button from '../ui/Button.vue'\n\n/**\n * The picker's filters: a small form whose state becomes the table's `filters`. Searchable\n * selects among them load options through the owning form's endpoint (`pickerFilters`).\n */\nconst props = defineProps<{ table: TableSchema; owner: FormStore; path: string }>()\nconst emit = defineEmits<{ change: [filters: Record<string, Record<string, unknown>> | null] }>()\nconst t = useT()\nconst components = computed(() => filterFormComponents(props.table.filters ?? []))\nconst store = new FormStore(\n  {\n    components: components.value,\n    state: props.table.filterState ?? {},\n    columns: props.table.filtersFormColumns ?? { default: 1, sm: 2 },\n  },\n  pickerFilterFormOptions(props.owner, props.path),\n)\n\nprovideForm(store)\n\nconst state = useStore(store.store)\nlet timer: ReturnType<typeof setTimeout> | null = null\n\nwatch(\n  () => [state.value.values, state.value.dirty] as const,\n  ([values, dirty]) => {\n    if (timer) clearTimeout(timer)\n    if (!dirty.size) return\n\n    timer = setTimeout(() => emit('change', values as Record<string, Record<string, unknown>>), 400)\n  },\n)\n\nconst reset = () => {\n  store.fill({ components: components.value, state: {}, columns: state.value.columns })\n  emit('change', null)\n}\n\nonScopeDispose(() => {\n  if (timer) clearTimeout(timer)\n  store.destroy()\n})\n</script>\n\n<template>\n  <div class=\"bg-muted/30 flex flex-col gap-2 rounded-lg border p-3\">\n    <SchemaRenderer :components=\"state.components\" :columns=\"state.columns\" class=\"gap-3\" />\n    <Button\n      v-if=\"(props.table.filterIndicators?.length ?? 0) > 0\"\n      type=\"button\"\n      variant=\"link\"\n      size=\"sm\"\n      class=\"self-end\"\n      @click=\"reset\"\n      >{{ t('table.reset_filters', {}, 'Reset') }}</Button\n    >\n  </div>\n</template>\n"],"mappings":""}

package/dist/components/fields/ModalTablePickerFilters.vue.d.ts

@@ -0,0 +1,18 @@
+import type { TableSchema } from '@alfakit/core';
+import { FormStore } from '@alfakit/core';
+/**
+ * The picker's filters: a small form whose state becomes the table's `filters`. Searchable
+ * selects among them load options through the owning form's endpoint (`pickerFilters`).
+ */
+type __VLS_Props = {
+    table: TableSchema;
+    owner: FormStore;
+    path: string;
+};
+declare const _default: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    change: (filters: Record<string, Record<string, unknown>> | null) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+    onChange?: ((filters: Record<string, Record<string, unknown>> | null) => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+export default _default;
+//# sourceMappingURL=ModalTablePickerFilters.vue.d.ts.map

package/dist/components/fields/ModalTablePickerFilters.vue.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ModalTablePickerFilters.vue.d.ts","sourceRoot":"","sources":["../../../src/components/fields/ModalTablePickerFilters.vue"],"names":[],"mappings":"AAqEA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,eAAe,CAAA;AAChD,OAAO,EAAE,SAAS,EAAiD,MAAM,eAAe,CAAA;AAQxF;;;GAGG;AACH,KAAK,WAAW,GAAG;IAAE,KAAK,EAAE,WAAW,CAAC;IAAC,KAAK,EAAE,SAAS,CAAC;IAAC,IAAI,EAAE,MAAM,CAAA;CAAE,CAAC;;;;;;AA2H1E,wBAOG"}

package/dist/components/fields/ModalTablePickerFilters.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,60 @@
+import { useT as e } from "../../context.js";
+import { useStore as t } from "../../composables/use-store.js";
+import n from "../ui/Button2.js";
+import { provideForm as r } from "../form/form-context.js";
+import i from "../schema/SchemaRenderer.js";
+import { FormStore as a, filterFormComponents as o, pickerFilterFormOptions as s } from "@alfakit/core";
+import { computed as c, createBlock as l, createCommentVNode as u, createElementBlock as d, createTextVNode as f, createVNode as p, defineComponent as m, onScopeDispose as h, openBlock as g, toDisplayString as _, unref as v, watch as y, withCtx as b } from "vue";
+//#region src/components/fields/ModalTablePickerFilters.vue?vue&type=script&setup=true&lang.ts
+var x = { class: "bg-muted/30 flex flex-col gap-2 rounded-lg border p-3" }, S = /*@__PURE__*/ m({
+	__name: "ModalTablePickerFilters",
+	props: {
+		table: {},
+		owner: {},
+		path: {}
+	},
+	emits: ["change"],
+	setup(m, { emit: S }) {
+		let C = m, w = S, T = e(), E = c(() => o(C.table.filters ?? [])), D = new a({
+			components: E.value,
+			state: C.table.filterState ?? {},
+			columns: C.table.filtersFormColumns ?? {
+				default: 1,
+				sm: 2
+			}
+		}, s(C.owner, C.path));
+		r(D);
+		let O = t(D.store), k = null;
+		y(() => [O.value.values, O.value.dirty], ([e, t]) => {
+			k && clearTimeout(k), t.size && (k = setTimeout(() => w("change", e), 400));
+		});
+		let A = () => {
+			D.fill({
+				components: E.value,
+				state: {},
+				columns: O.value.columns
+			}), w("change", null);
+		};
+		return h(() => {
+			k && clearTimeout(k), D.destroy();
+		}), (e, t) => (g(), d("div", x, [p(i, {
+			components: v(O).components,
+			columns: v(O).columns,
+			class: "gap-3"
+		}, null, 8, ["components", "columns"]), (C.table.filterIndicators?.length ?? 0) > 0 ? (g(), l(n, {
+			key: 0,
+			type: "button",
+			variant: "link",
+			size: "sm",
+			class: "self-end",
+			onClick: A
+		}, {
+			default: b(() => [f(_(v(T)("table.reset_filters", {}, "Reset")), 1)]),
+			_: 1
+		})) : u("", !0)]));
+	}
+});
+//#endregion
+export { S as default };
+
+//# sourceMappingURL=ModalTablePickerFilters.vue_vue_type_script_setup_true_lang.js.map

package/dist/components/fields/ModalTablePickerFilters.vue_vue_type_script_setup_true_lang.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ModalTablePickerFilters.vue_vue_type_script_setup_true_lang.js","names":["_openBlock","_createElementBlock","_createVNode","SchemaRenderer","_unref","_createBlock","Button","_withCtx","_createTextVNode","_toDisplayString","_createCommentVNode","Button_default","SchemaRenderer_default","_hoisted_1","ModalTablePickerFilters_vue_vue_type_script_setup_true_lang_default","__emit","props","__props","emit","t","useT","components","computed","filterFormComponents","store","FormStore","pickerFilterFormOptions","state","useStore","timer","values","dirty","reset","onScopeDispose","openBlock","createElementBlock","createVNode","unref","createBlock","withCtx","createTextVNode","toDisplayString","createCommentVNode"],"sources":["../../../src/components/fields/ModalTablePickerFilters.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { TableSchema } from '@alfakit/core'\nimport { FormStore, filterFormComponents, pickerFilterFormOptions } from '@alfakit/core'\nimport { computed, onScopeDispose, watch } from 'vue'\nimport { useStore } from '../../composables/use-store'\nimport { useT } from '../../context'\nimport { provideForm } from '../form/form-context'\nimport SchemaRenderer from '../schema/SchemaRenderer.vue'\nimport Button from '../ui/Button.vue'\n\n/**\n * The picker's filters: a small form whose state becomes the table's `filters`. Searchable\n * selects among them load options through the owning form's endpoint (`pickerFilters`).\n */\nconst props = defineProps<{ table: TableSchema; owner: FormStore; path: string }>()\nconst emit = defineEmits<{ change: [filters: Record<string, Record<string, unknown>> | null] }>()\nconst t = useT()\nconst components = computed(() => filterFormComponents(props.table.filters ?? []))\nconst store = new FormStore(\n  {\n    components: components.value,\n    state: props.table.filterState ?? {},\n    columns: props.table.filtersFormColumns ?? { default: 1, sm: 2 },\n  },\n  pickerFilterFormOptions(props.owner, props.path),\n)\n\nprovideForm(store)\n\nconst state = useStore(store.store)\nlet timer: ReturnType<typeof setTimeout> | null = null\n\nwatch(\n  () => [state.value.values, state.value.dirty] as const,\n  ([values, dirty]) => {\n    if (timer) clearTimeout(timer)\n    if (!dirty.size) return\n\n    timer = setTimeout(() => emit('change', values as Record<string, Record<string, unknown>>), 400)\n  },\n)\n\nconst reset = () => {\n  store.fill({ components: components.value, state: {}, columns: state.value.columns })\n  emit('change', null)\n}\n\nonScopeDispose(() => {\n  if (timer) clearTimeout(timer)\n  store.destroy()\n})\n</script>\n\n<template>\n  <div class=\"bg-muted/30 flex flex-col gap-2 rounded-lg border p-3\">\n    <SchemaRenderer :components=\"state.components\" :columns=\"state.columns\" class=\"gap-3\" />\n    <Button\n      v-if=\"(props.table.filterIndicators?.length ?? 0) > 0\"\n      type=\"button\"\n      variant=\"link\"\n      size=\"sm\"\n      class=\"self-end\"\n      @click=\"reset\"\n      >{{ t('table.reset_filters', {}, 'Reset') }}</Button\n    >\n  </div>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;EAcA,IAAMgB,IAAQC,GACRC,IAAOH,GACPI,IAAIC,EAAK,GACTC,IAAaC,QAAeC,EAAqBP,EAAM,MAAM,WAAW,CAAC,CAAC,CAAC,GAC3EQ,IAAQ,IAAIC,EAChB;GACE,YAAYJ,EAAW;GACvB,OAAOL,EAAM,MAAM,eAAe,CAAC;GACnC,SAASA,EAAM,MAAM,sBAAsB;IAAE,SAAS;IAAG,IAAI;GAAE;EACjE,GACAU,EAAwBV,EAAM,OAAOA,EAAM,IAAI,CACjD;EAEA,EAAYQ,CAAK;EAEjB,IAAMG,IAAQC,EAASJ,EAAM,KAAK,GAC9BK,IAA8C;EAElD,QACQ,CAACF,EAAM,MAAM,QAAQA,EAAM,MAAM,KAAK,IAC3C,CAACG,GAAQC,OAAW;GAEnB,AADIF,KAAO,aAAaA,CAAK,GACxBE,EAAM,SAEX,IAAQ,iBAAiBb,EAAK,UAAUY,CAAiD,GAAG,GAAG;EACjG,CACF;EAEA,IAAME,UAAc;GAElB,AADAR,EAAM,KAAK;IAAE,YAAYH,EAAW;IAAO,OAAO,CAAC;IAAG,SAASM,EAAM,MAAM;GAAQ,CAAC,GACpFT,EAAK,UAAU,IAAI;EACrB;SAEAe,QAAqB;GAEnB,AADIJ,KAAO,aAAaA,CAAK,GAC7BL,EAAM,QAAQ;EAChB,CAAC,cAICxB,EAAA,GAAAC,EAWM,OAXNY,GAWM,CAVJX,EAAwFC,GAAA;GAAvE,YAAYC,EAAAuB,CAAA,CAAK,CAAC;GAAa,SAASvB,EAAAuB,CAAA,CAAK,CAAC;GAAS,OAAM;EAErE,GAAA,MAAA,GAAA,CAAA,cAAA,SAAA,CAAA,IAAAX,EAAM,MAAM,kBAAkB,UAAM,KAAA,KAD7ChB,EAAA,GAAAK,EAQCC,GAAA;;GANC,MAAK;GACL,SAAQ;GACR,MAAK;GACL,OAAM;GACL,SAAO0B;;GACP,SAAAzB,QAA2C,CAAxCC,EAAAC,EAAAL,EAAAe,CAAA,CAAC,CAAA,uBAAA,CAAA,GAAA,OAAA,CAAA,GAAA,CAAA,CAAA,CAAA"}

package/dist/components/fields/ModalTableSelectField.js

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

package/dist/components/fields/ModalTableSelectField.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ModalTableSelectField.js","names":["_sfc_main","ModalTableSelectField_vue_vue_type_script_setup_true_lang_default","ModalTableSelectField_default"],"sources":["../../../src/components/fields/ModalTableSelectField.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { ModalTableSelectSchema } from '@alfakit/core'\nimport { fieldIds, modalTableSelected } from '@alfakit/core'\nimport { XIcon } from '@lucide/vue'\nimport { computed, ref } from 'vue'\nimport { useT } from '../../context'\nimport { useField } from '../form/form-context'\nimport FieldWrapper from '../schema/FieldWrapper.vue'\nimport Badge from '../ui/Badge.vue'\nimport Button from '../ui/Button.vue'\nimport { Icon } from '../../lib/icons'\nimport ModalTablePicker from './ModalTablePicker.vue'\n\n/**\n * Select records from a table in a modal. The table (columns, search, filters, sorting,\n * pagination) comes from the server's picker endpoint; the field keeps only keys, with\n * labels from the server.\n */\nconst props = defineProps<{ component: ModalTableSelectSchema }>()\nconst t = useT()\nconst { value, setValue, error, id, disabled, readOnly, aria } = useField<unknown>(\n  () => props.component,\n)\nconst multiple = computed(() => Boolean(props.component.multiple))\nconst selected = computed(() => modalTableSelected(value.value, multiple.value))\nconst locked = computed(() => disabled.value || readOnly.value)\nconst open = ref(false)\nconst picked = ref<Record<string, string>>({})\nconst labels = computed(() => ({ ...picked.value, ...props.component.selectedLabels }))\n\nconst store = (keys: string[]) => setValue(multiple.value ? keys : (keys[0] ?? null))\nconst onConfirm = (keys: string[], newLabels: Record<string, string>) => {\n  picked.value = { ...picked.value, ...newLabels }\n  store(keys)\n  open.value = false\n}\n</script>\n\n<template>\n  <FieldWrapper :field=\"props.component\" :html-for=\"id\" :error=\"error\">\n    <div\n      :id=\"id\"\n      role=\"group\"\n      data-slot=\"modal-table-select\"\n      class=\"flex flex-wrap items-center gap-2\"\n      :aria-labelledby=\"props.component.label ? fieldIds(id).label : undefined\"\n      :aria-describedby=\"aria['aria-describedby']\"\n    >\n      <span v-if=\"selected.length === 0\" class=\"text-muted-foreground text-sm\">{{\n        props.component.placeholder ?? t('table_select.none', {}, 'Nothing selected')\n      }}</span>\n      <Badge v-for=\"key in selected\" v-else :key=\"key\" variant=\"secondary\" class=\"gap-1 pe-1\">\n        <span>{{ labels[key] ?? key }}</span>\n        <button\n          v-if=\"!locked\"\n          type=\"button\"\n          class=\"hover:bg-foreground/10 rounded-sm\"\n          :aria-label=\"t('table_select.remove', { label: labels[key] ?? key }, 'Remove :label')\"\n          @click=\"store(selected.filter((candidate) => candidate !== key))\"\n        >\n          <XIcon class=\"size-3\" />\n        </button>\n      </Badge>\n      <Button\n        v-if=\"!locked\"\n        type=\"button\"\n        variant=\"outline\"\n        size=\"sm\"\n        aria-haspopup=\"dialog\"\n        @click=\"open = true\"\n        ><Icon v-if=\"props.component.selectActionIcon\" :name=\"props.component.selectActionIcon\" />{{\n          selected.length > 0 && !multiple\n            ? t('table_select.change', {}, 'Change')\n            : props.component.selectActionLabel\n        }}</Button\n      >\n    </div>\n    <ModalTablePicker\n      v-if=\"open\"\n      :component=\"props.component\"\n      :initial=\"selected\"\n      @close=\"open = false\"\n      @confirm=\"onConfirm\"\n    />\n  </FieldWrapper>\n</template>\n"],"mappings":""}

package/dist/components/fields/ModalTableSelectField.vue.d.ts

@@ -0,0 +1,12 @@
+import type { ModalTableSelectSchema } from '@alfakit/core';
+/**
+ * Select records from a table in a modal. The table (columns, search, filters, sorting,
+ * pagination) comes from the server's picker endpoint; the field keeps only keys, with
+ * labels from the server.
+ */
+type __VLS_Props = {
+    component: ModalTableSelectSchema;
+};
+declare const _default: 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>;
+export default _default;
+//# sourceMappingURL=ModalTableSelectField.vue.d.ts.map

package/dist/components/fields/ModalTableSelectField.vue.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ModalTableSelectField.vue.d.ts","sourceRoot":"","sources":["../../../src/components/fields/ModalTableSelectField.vue"],"names":[],"mappings":"AAwFA,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,eAAe,CAAA;AAY3D;;;;GAIG;AACH,KAAK,WAAW,GAAG;IAAE,SAAS,EAAE,sBAAsB,CAAA;CAAE,CAAC;;AA4NzD,wBAMG"}

package/dist/components/fields/ModalTableSelectField.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,88 @@
+import { useT as e } from "../../context.js";
+import t from "../../lib/Icon.js";
+import n from "../ui/Badge2.js";
+import r from "../ui/Button2.js";
+import { useField as i } from "../form/form-context.js";
+import a from "../schema/FieldWrapper.js";
+import o from "./ModalTablePicker.js";
+import { fieldIds as s, modalTableSelected as c } from "@alfakit/core";
+import { Fragment as l, computed as u, createBlock as d, createCommentVNode as f, createElementBlock as p, createElementVNode as m, createTextVNode as h, createVNode as g, defineComponent as _, openBlock as v, ref as y, renderList as b, toDisplayString as x, unref as S, withCtx as C } from "vue";
+import { XIcon as w } from "@lucide/vue";
+//#region src/components/fields/ModalTableSelectField.vue?vue&type=script&setup=true&lang.ts
+var T = [
+	"id",
+	"aria-labelledby",
+	"aria-describedby"
+], E = {
+	key: 0,
+	class: "text-muted-foreground text-sm"
+}, D = ["aria-label", "onClick"], O = /*@__PURE__*/ _({
+	__name: "ModalTableSelectField",
+	props: { component: {} },
+	setup(_) {
+		let O = _, k = e(), { value: A, setValue: j, error: M, id: N, disabled: P, readOnly: F, aria: I } = i(() => O.component), L = u(() => !!O.component.multiple), R = u(() => c(A.value, L.value)), z = u(() => P.value || F.value), B = y(!1), V = y({}), H = u(() => ({
+			...V.value,
+			...O.component.selectedLabels
+		})), U = (e) => j(L.value ? e : e[0] ?? null), W = (e, t) => {
+			V.value = {
+				...V.value,
+				...t
+			}, U(e), B.value = !1;
+		};
+		return (e, i) => (v(), d(a, {
+			field: O.component,
+			"html-for": S(N),
+			error: S(M)
+		}, {
+			default: C(() => [m("div", {
+				id: S(N),
+				role: "group",
+				"data-slot": "modal-table-select",
+				class: "flex flex-wrap items-center gap-2",
+				"aria-labelledby": O.component.label ? S(s)(S(N)).label : void 0,
+				"aria-describedby": S(I)["aria-describedby"]
+			}, [R.value.length === 0 ? (v(), p("span", E, x(O.component.placeholder ?? S(k)("table_select.none", {}, "Nothing selected")), 1)) : (v(!0), p(l, { key: 1 }, b(R.value, (e) => (v(), d(n, {
+				key: e,
+				variant: "secondary",
+				class: "gap-1 pe-1"
+			}, {
+				default: C(() => [m("span", null, x(H.value[e] ?? e), 1), z.value ? f("", !0) : (v(), p("button", {
+					key: 0,
+					type: "button",
+					class: "hover:bg-foreground/10 rounded-sm",
+					"aria-label": S(k)("table_select.remove", { label: H.value[e] ?? e }, "Remove :label"),
+					onClick: (t) => U(R.value.filter((t) => t !== e))
+				}, [g(S(w), { class: "size-3" })], 8, D))]),
+				_: 2
+			}, 1024))), 128)), z.value ? f("", !0) : (v(), d(r, {
+				key: 2,
+				type: "button",
+				variant: "outline",
+				size: "sm",
+				"aria-haspopup": "dialog",
+				onClick: i[0] ||= (e) => B.value = !0
+			}, {
+				default: C(() => [O.component.selectActionIcon ? (v(), d(S(t), {
+					key: 0,
+					name: O.component.selectActionIcon
+				}, null, 8, ["name"])) : f("", !0), h(x(R.value.length > 0 && !L.value ? S(k)("table_select.change", {}, "Change") : O.component.selectActionLabel), 1)]),
+				_: 1
+			}))], 8, T), B.value ? (v(), d(o, {
+				key: 0,
+				component: O.component,
+				initial: R.value,
+				onClose: i[1] ||= (e) => B.value = !1,
+				onConfirm: W
+			}, null, 8, ["component", "initial"])) : f("", !0)]),
+			_: 1
+		}, 8, [
+			"field",
+			"html-for",
+			"error"
+		]));
+	}
+});
+//#endregion
+export { O as default };
+
+//# sourceMappingURL=ModalTableSelectField.vue_vue_type_script_setup_true_lang.js.map