npm - @alfakit/vue - Versions diffs - 0.1.1 → 0.1.6 - Mend

@alfakit/vue 0.1.1 → 0.1.6

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (372) hide show

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

	@@ -1 +1 @@
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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"}
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","format","useFormatter","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, useFormatter, 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 format = useFormatter()\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 {\n first: format.number(paging.from),\n last: format.number(paging.to),\n total: format.number(paging.total),\n },\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/OneTimeCodeInputField.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"OneTimeCodeInputField.js","names":["_sfc_main","OneTimeCodeInputField_vue_vue_type_script_setup_true_lang_default","OneTimeCodeInputField_default"],"sources":["../../../src/components/fields/OneTimeCodeInputField.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { OneTimeCodeSubmitter, oneTimeCodeDigits, type OneTimeCodeInputSchema } from '@alfakit/core'\nimport { useField } from '../form/form-context'\nimport FieldWrapper from '../schema/FieldWrapper.vue'\nimport Input from '../ui/Input.vue'\n\n/*\n `OneTimeCodeInput`: one numeric input with `autocomplete=\"one-time-code\"` (browsers and\n * password managers fill it from an SMS or email), digits only, left to right in every\n * language. `submitOnCompletion()` submits the form once the last digit is in.\n /\nconst props = defineProps<{ component: OneTimeCodeInputSchema }>()\nconst { value, setValue, blur, error, id, disabled, aria } = useField<string \| null>(\n () => props.component,\n)\nconst submitter = new OneTimeCodeSubmitter()\n\nconst onInput = (event: Event) => {\n const input = event.target as HTMLInputElement\n const code = oneTimeCodeDigits(input.value, props.component.length)\n\n // A rejected character leaves the model value unchanged: correct the DOM too.\n if (code !== input.value) input.value = code\n\n setValue(code === '' ? null : code)\n\n // After the state reached the form store, so the submitted values include it.\n if (props.component.submitOnCompletion) {\n const form = input.form\n\n queueMicrotask(() => submitter.update(code, props.component.length, form))\n }\n}\n</script>\n\n<template>\n <FieldWrapper :field=\"props.component\" :html-for=\"id\" :error=\"error\">\n <Input\n :id=\"id\"\n :name=\"props.component.name\"\n type=\"text\"\n dir=\"ltr\"\n inputmode=\"numeric\"\n autocomplete=\"one-time-code\"\n pattern=\"[0-9]\"\n :~~maxlength=\"props.component.length\"\n :~~model-value=\"value ?? ''\"\n :placeholder=\"props.component.placeholder\"\n :disabled=\"disabled\"\n :readonly=\"props.component.readOnly\"\n :required=\"props.component.required\"\n :autofocus=\"props.component.autofocus\"\n :aria-invalid=\"aria['aria-invalid']\"\n :aria-describedby=\"aria['aria-describedby']\"\n :aria-required=\"aria['aria-required']\"\n data-slot=\"one-time-code-input\"\n class=\"max-w-56 text-center font-mono text-lg tracking-[0.5em] tabular-nums\"\n v-bind=\"props.component.extraInputAttributes\"\n @input=\"onInput\"\n @blur=\"blur\"\n />\n </FieldWrapper>\n</template>\n"],"mappings":""}
1	+ {"version":3,"file":"OneTimeCodeInputField.js","names":["_sfc_main","OneTimeCodeInputField_vue_vue_type_script_setup_true_lang_default","OneTimeCodeInputField_default"],"sources":["../../../src/components/fields/OneTimeCodeInputField.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { OneTimeCodeSubmitter, oneTimeCodeDigits, type OneTimeCodeInputSchema } from '@alfakit/core'\nimport { useField } from '../form/form-context'\nimport FieldWrapper from '../schema/FieldWrapper.vue'\nimport Input from '../ui/Input.vue'\n\n/*\n `OneTimeCodeInput`: one numeric input with `autocomplete=\"one-time-code\"` (browsers and\n * password managers fill it from an SMS or email), digits only, left to right in every\n * language. `submitOnCompletion()` submits the form once the last digit is in.\n /\nconst props = defineProps<{ component: OneTimeCodeInputSchema }>()\nconst { value, setValue, blur, error, id, disabled, aria } = useField<string \| null>(\n () => props.component,\n)\nconst submitter = new OneTimeCodeSubmitter()\n\nconst onInput = (event: Event) => {\n const input = event.target as HTMLInputElement\n const code = oneTimeCodeDigits(input.value, props.component.length)\n\n // A rejected character leaves the model value unchanged: correct the DOM too.\n if (code !== input.value) input.value = code\n\n setValue(code === '' ? null : code)\n\n // After the state reached the form store, so the submitted values include it.\n if (props.component.submitOnCompletion) {\n const form = input.form\n\n queueMicrotask(() => submitter.update(code, props.component.length, form))\n }\n}\n</script>\n\n<template>\n <FieldWrapper :field=\"props.component\" :html-for=\"id\" :error=\"error\">\n <Input\n :id=\"id\"\n :name=\"props.component.name\"\n type=\"text\"\n dir=\"ltr\"\n inputmode=\"numeric\"\n autocomplete=\"one-time-code\"\n pattern=\"[0-9]\"\n :model-value=\"value ?? ''\"\n :placeholder=\"props.component.placeholder\"\n :disabled=\"disabled\"\n :readonly=\"props.component.readOnly\"\n :required=\"props.component.required\"\n :autofocus=\"props.component.autofocus\"\n :aria-invalid=\"aria['aria-invalid']\"\n :aria-describedby=\"aria['aria-describedby']\"\n :aria-required=\"aria['aria-required']\"\n data-slot=\"one-time-code-input\"\n data-input=\"\"\n class=\"max-w-56 text-center font-mono text-lg tracking-[0.5em] tabular-nums\"\n v-bind=\"props.component.extraInputAttributes\"\n @input=\"onInput\"\n @blur=\"blur\"\n />\n </FieldWrapper>\n</template>\n"],"mappings":""}

package/dist/components/fields/OneTimeCodeInputField.vue_vue_type_script_setup_true_lang.js CHANGED Viewed

@@ -28,7 +28,6 @@ var f = /*@__PURE__*/ s({
 				inputmode: "numeric",
 				autocomplete: "one-time-code",
 				pattern: "[0-9]*",
-				maxlength: f.component.length,
 				"model-value": u(p) ?? "",
 				placeholder: f.component.placeholder,
 				disabled: u(v),
@@ -39,6 +38,7 @@ var f = /*@__PURE__*/ s({
 				"aria-describedby": u(y)["aria-describedby"],
 				"aria-required": u(y)["aria-required"],
 				"data-slot": "one-time-code-input",
+				"data-input": "",
 				class: "max-w-56 text-center font-mono text-lg tracking-[0.5em] tabular-nums"
 			}, f.component.extraInputAttributes, {
 				onInput: x,
@@ -46,7 +46,6 @@ var f = /*@__PURE__*/ s({
 			}), null, 16, [
 				"id",
 				"name",
-				"maxlength",
 				"model-value",
 				"placeholder",
 				"disabled",

package/dist/components/fields/OneTimeCodeInputField.vue_vue_type_script_setup_true_lang.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"OneTimeCodeInputField.vue_vue_type_script_setup_true_lang.js","names":["_openBlock","_createBlock","FieldWrapper","_unref","_withCtx","_createVNode","Input","_mergeProps","Input_default","FieldWrapper_default","OneTimeCodeInputField_vue_vue_type_script_setup_true_lang_default","props","__props","useField","submitter","OneTimeCodeSubmitter","onInput","input","event","code","oneTimeCodeDigits","setValue","form","openBlock","createBlock","unref","id","error","withCtx","createVNode","mergeProps","value","disabled","aria","blur"],"sources":["../../../src/components/fields/OneTimeCodeInputField.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { OneTimeCodeSubmitter, oneTimeCodeDigits, type OneTimeCodeInputSchema } from '@alfakit/core'\nimport { useField } from '../form/form-context'\nimport FieldWrapper from '../schema/FieldWrapper.vue'\nimport Input from '../ui/Input.vue'\n\n/*\n `OneTimeCodeInput`: one numeric input with `autocomplete=\"one-time-code\"` (browsers and\n * password managers fill it from an SMS or email), digits only, left to right in every\n * language. `submitOnCompletion()` submits the form once the last digit is in.\n /\nconst props = defineProps<{ component: OneTimeCodeInputSchema }>()\nconst { value, setValue, blur, error, id, disabled, aria } = useField<string \| null>(\n () => props.component,\n)\nconst submitter = new OneTimeCodeSubmitter()\n\nconst onInput = (event: Event) => {\n const input = event.target as HTMLInputElement\n const code = oneTimeCodeDigits(input.value, props.component.length)\n\n // A rejected character leaves the model value unchanged: correct the DOM too.\n if (code !== input.value) input.value = code\n\n setValue(code === '' ? null : code)\n\n // After the state reached the form store, so the submitted values include it.\n if (props.component.submitOnCompletion) {\n const form = input.form\n\n queueMicrotask(() => submitter.update(code, props.component.length, form))\n }\n}\n</script>\n\n<template>\n <FieldWrapper :field=\"props.component\" :html-for=\"id\" :error=\"error\">\n <Input\n :id=\"id\"\n :name=\"props.component.name\"\n type=\"text\"\n dir=\"ltr\"\n inputmode=\"numeric\"\n autocomplete=\"one-time-code\"\n pattern=\"[0-9]\"\n :~~maxlength=\"props.component.length\"\n :~~model-value=\"value ?? ''\"\n :placeholder=\"props.component.placeholder\"\n :disabled=\"disabled\"\n :readonly=\"props.component.readOnly\"\n :required=\"props.component.required\"\n :autofocus=\"props.component.autofocus\"\n :aria-invalid=\"aria['aria-invalid']\"\n :aria-describedby=\"aria['aria-describedby']\"\n :aria-required=\"aria['aria-required']\"\n data-slot=\"one-time-code-input\"\n class=\"max-w-56 text-center font-mono text-lg tracking-[0.5em] tabular-nums\"\n v-bind=\"props.component.extraInputAttributes\"\n @input=\"onInput\"\n @blur=\"blur\"\n />\n </FieldWrapper>\n</template>\n"],"mappings":";;;;;;;;;;EAWA,IAAMW,IAAQC,GACR,EAAE,UAAO,aAAU,SAAM,UAAO,OAAI,aAAU,YAASC,QACrDF,EAAM,SACd,GACMG,IAAY,IAAIC,EAAqB,GAErCC,KAAW,MAAiB;GAChC,IAAMC,IAAQC,EAAM,QACdC,IAAOC,EAAkBH,EAAM,OAAON,EAAM,UAAU,MAAM;GAQlE,IALIQ,MAASF,EAAM,UAAO,EAAM,QAAQE,IAExCE,EAASF,MAAS,KAAK,OAAOA,CAAI,GAG9BR,EAAM,UAAU,oBAAoB;IACtC,IAAMW,IAAOL,EAAM;IAEnB,qBAAqBH,EAAU,OAAOK,GAAMR,EAAM,UAAU,QAAQW,CAAI,CAAC;GAC3E;EACF;oBAIEtB,EAAA,GAAAC,EAyBeC,GAAA;GAzBA,OAAOS,EAAM;GAAY,YAAUR,EAAAuB,CAAA;GAAK,OAAOvB,EAAAwB,CAAA;;GAC5D,SAAAvB,QAuBE,CAvBFC,EAuBEC,GAvBFC,EAuBE;IAtBC,IAAIJ,EAAAuB,CAAA;IACJ,MAAMf,EAAM,UAAU;IACvB,MAAK;IACL,KAAI;IACJ,WAAU;IACV,cAAa;IACb,SAAQ;IACP,~~WAAWA,EAAM,UAAU;IAC3B,~~eAAaR,EAAA4B,CAAA,KAAK;IAClB,aAAapB,EAAM,UAAU;IAC7B,UAAUR,EAAA6B,CAAA;IACV,UAAUrB,EAAM,UAAU;IAC1B,UAAUA,EAAM,UAAU;IAC1B,WAAWA,EAAM,UAAU;IAC3B,gBAAcR,EAAA8B,CAAA,CAAI,CAAA;IAClB,oBAAkB9B,EAAA8B,CAAA,CAAI,CAAA;IACtB,iBAAe9B,EAAA8B,CAAA,CAAI,CAAA;IACpB,aAAU;IACV,OAAM;GACE,GAAAtB,EAAM,UAAU,sBAAoB;IACpC;IACP,QAAMR,EAAA+B,CAAA"}
1	+ {"version":3,"file":"OneTimeCodeInputField.vue_vue_type_script_setup_true_lang.js","names":["_openBlock","_createBlock","FieldWrapper","_unref","_withCtx","_createVNode","Input","_mergeProps","Input_default","FieldWrapper_default","OneTimeCodeInputField_vue_vue_type_script_setup_true_lang_default","props","__props","useField","submitter","OneTimeCodeSubmitter","onInput","input","event","code","oneTimeCodeDigits","setValue","form","openBlock","createBlock","unref","id","error","withCtx","createVNode","mergeProps","value","disabled","aria","blur"],"sources":["../../../src/components/fields/OneTimeCodeInputField.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { OneTimeCodeSubmitter, oneTimeCodeDigits, type OneTimeCodeInputSchema } from '@alfakit/core'\nimport { useField } from '../form/form-context'\nimport FieldWrapper from '../schema/FieldWrapper.vue'\nimport Input from '../ui/Input.vue'\n\n/*\n `OneTimeCodeInput`: one numeric input with `autocomplete=\"one-time-code\"` (browsers and\n * password managers fill it from an SMS or email), digits only, left to right in every\n * language. `submitOnCompletion()` submits the form once the last digit is in.\n /\nconst props = defineProps<{ component: OneTimeCodeInputSchema }>()\nconst { value, setValue, blur, error, id, disabled, aria } = useField<string \| null>(\n () => props.component,\n)\nconst submitter = new OneTimeCodeSubmitter()\n\nconst onInput = (event: Event) => {\n const input = event.target as HTMLInputElement\n const code = oneTimeCodeDigits(input.value, props.component.length)\n\n // A rejected character leaves the model value unchanged: correct the DOM too.\n if (code !== input.value) input.value = code\n\n setValue(code === '' ? null : code)\n\n // After the state reached the form store, so the submitted values include it.\n if (props.component.submitOnCompletion) {\n const form = input.form\n\n queueMicrotask(() => submitter.update(code, props.component.length, form))\n }\n}\n</script>\n\n<template>\n <FieldWrapper :field=\"props.component\" :html-for=\"id\" :error=\"error\">\n <Input\n :id=\"id\"\n :name=\"props.component.name\"\n type=\"text\"\n dir=\"ltr\"\n inputmode=\"numeric\"\n autocomplete=\"one-time-code\"\n pattern=\"[0-9]\"\n :model-value=\"value ?? ''\"\n :placeholder=\"props.component.placeholder\"\n :disabled=\"disabled\"\n :readonly=\"props.component.readOnly\"\n :required=\"props.component.required\"\n :autofocus=\"props.component.autofocus\"\n :aria-invalid=\"aria['aria-invalid']\"\n :aria-describedby=\"aria['aria-describedby']\"\n :aria-required=\"aria['aria-required']\"\n data-slot=\"one-time-code-input\"\n data-input=\"\"\n class=\"max-w-56 text-center font-mono text-lg tracking-[0.5em] tabular-nums\"\n v-bind=\"props.component.extraInputAttributes\"\n @input=\"onInput\"\n @blur=\"blur\"\n />\n </FieldWrapper>\n</template>\n"],"mappings":";;;;;;;;;;EAWA,IAAMW,IAAQC,GACR,EAAE,UAAO,aAAU,SAAM,UAAO,OAAI,aAAU,YAASC,QACrDF,EAAM,SACd,GACMG,IAAY,IAAIC,EAAqB,GAErCC,KAAW,MAAiB;GAChC,IAAMC,IAAQC,EAAM,QACdC,IAAOC,EAAkBH,EAAM,OAAON,EAAM,UAAU,MAAM;GAQlE,IALIQ,MAASF,EAAM,UAAO,EAAM,QAAQE,IAExCE,EAASF,MAAS,KAAK,OAAOA,CAAI,GAG9BR,EAAM,UAAU,oBAAoB;IACtC,IAAMW,IAAOL,EAAM;IAEnB,qBAAqBH,EAAU,OAAOK,GAAMR,EAAM,UAAU,QAAQW,CAAI,CAAC;GAC3E;EACF;oBAIEtB,EAAA,GAAAC,EAyBeC,GAAA;GAzBA,OAAOS,EAAM;GAAY,YAAUR,EAAAuB,CAAA;GAAK,OAAOvB,EAAAwB,CAAA;;GAC5D,SAAAvB,QAuBE,CAvBFC,EAuBEC,GAvBFC,EAuBE;IAtBC,IAAIJ,EAAAuB,CAAA;IACJ,MAAMf,EAAM,UAAU;IACvB,MAAK;IACL,KAAI;IACJ,WAAU;IACV,cAAa;IACb,SAAQ;IACP,eAAaR,EAAA4B,CAAA,KAAK;IAClB,aAAapB,EAAM,UAAU;IAC7B,UAAUR,EAAA6B,CAAA;IACV,UAAUrB,EAAM,UAAU;IAC1B,UAAUA,EAAM,UAAU;IAC1B,WAAWA,EAAM,UAAU;IAC3B,gBAAcR,EAAA8B,CAAA,CAAI,CAAA;IAClB,oBAAkB9B,EAAA8B,CAAA,CAAI,CAAA;IACtB,iBAAe9B,EAAA8B,CAAA,CAAI,CAAA;IACpB,aAAU;IACV,cAAW;IACX,OAAM;GACE,GAAAtB,EAAM,UAAU,sBAAoB;IACpC;IACP,QAAMR,EAAA+B,CAAA"}

package/dist/components/fields/RepeaterField.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"RepeaterField.js","names":["_sfc_main","RepeaterField_vue_vue_type_script_setup_true_lang_default","RepeaterField_default"],"sources":["../../../src/components/fields/RepeaterField.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { RepeaterSchema, SchemaComponent } from '@alfakit/core'\nimport {\n isDeferredPlaceholder,\n VIRTUAL_ESTIMATES,\n appendRepeaterItem,\n fieldIds,\n cloneIndexedState,\n cloneRepeaterItem,\n gridColumnsClasses,\n moveIndexedState,\n moveRepeaterItem,\n removeIndexedState,\n removeRepeaterItem,\n reorderedItemKeys,\n replacePlaceholder,\n resolveItemAction,\n virtualizeOptions,\n type ItemActionName,\n} from '@alfakit/core'\nimport { computed, ref } from 'vue'\nimport { useScrollToErroredItem, useVirtualList } from '../../composables/use-virtual-list'\nimport { useFormatter } from '../../context'\nimport { Icon } from '../../lib/icons'\nimport { cn } from '../../lib/utils'\nimport DeferredSchema from '../layout/DeferredSchema.vue'\nimport { useField } from '../form/form-context'\nimport { useFieldActionContext } from '../schema/field-actions'\nimport FieldWrapper from '../schema/FieldWrapper.vue'\nimport SchemaRenderer from '../schema/SchemaRenderer.vue'\nimport Collapsible from '../ui/Collapsible.vue'\nimport CollapsibleContent from '../ui/CollapsibleContent.vue'\nimport AddActionRow from './AddActionRow.vue'\nimport CollapseAllActions from './CollapseAllActions.vue'\nimport ItemActionButton from './ItemActionButton.vue'\nimport ItemHeaderActions from './ItemHeaderActions.vue'\nimport { useItemActionFallbacks, useItemMoves, useRunItemAction } from './item-actions'\nimport RepeaterTable from './RepeaterTable.vue'\n\n/*\n Items use the per-index schema from the server when available (so closures see item\n * state) and fall back to the template for freshly added items.\n */\nconst props = defineProps<{ component: RepeaterSchema }>()\nconst formatter = useFormatter()\nconst context = useFieldActionContext(() => props.component)\nconst runItemAction = useRunItemAction(context)\nconst fallbacks = useItemActionFallbacks()\nconst resolve = (name: ItemActionName, index?: number) =>\n resolveItemAction(\n name,\n props.component,\n index === undefined ? undefined : props.component.items[index],\n name === 'add' ? { ...fallbacks.add, label: props.component.addActionLabel } : fallbacks[name],\n )\nconst {\n value,\n setValue,\n error,\n id,\n disabled: fieldDisabled,\n readOnly,\n aria,\n} = useField<unknown[] \| null>(() => props.component)\n// Read-only shows the items but hides add, delete, clone and reorder controls.\nconst disabled = computed(() => fieldDisabled.value \|\| readOnly.value)\nconst items = computed(() => value.value ?? [])\nconst collapsed = ref<Record<number, boolean>>({})\nconst dragIndex = ref<number \| null>(null)\n// Long lists render only the visible items (plus a few around them); a multi-column\n// `grid()` is windowed by whole rows, counting its columns from the rendered grid.\nconst virtual = useVirtualList(\n () => items.value.length,\n () =>\n virtualizeOptions(\n props.component.virtualize,\n VIRTUAL_ESTIMATES.item,\n 12,\n props.component.grid ? 'auto' : 1,\n ),\n)\nuseScrollToErroredItem(virtual, () => props.component.statePath)\n\nconst schemaFor = (index: number): SchemaComponent[] =>\n props.component.items[index]?.schema ??\n replacePlaceholder(props.component.template, '__INDEX__', String(index))\nconst isCollapsed = (index: number) => collapsed.value[index] ?? props.component.collapsed ?? false\n\nconst canAdd = computed(\n () =>\n props.component.addable &&\n !disabled.value &&\n (props.component.maxItems == null \|\| items.value.length < props.component.maxItems),\n)\nconst canDelete = computed(\n () =>\n props.component.deletable &&\n !disabled.value &&\n (props.component.minItems == null \|\| items.value.length > props.component.minItems),\n)\n\n// Collapsed flags are keyed by index, so they move with their item.\nconst moveItem = (from: number, to: number) => {\n setValue(moveRepeaterItem(items.value, from, to))\n collapsed.value = moveIndexedState(collapsed.value, from, to)\n}\n// Move buttons: announced, one at a time, focus kept on the moved item.\nconst moves = useItemMoves(\n value,\n (from, to) => moveItem(from, to),\n (index) => props.component.items[index]?.label,\n () => items.value.length,\n)\nconst moveAnnouncement = moves.announcement\nconst moveContainer = moves.container\nconst removeItem = (index: number) => {\n setValue(removeRepeaterItem(items.value, index))\n collapsed.value = removeIndexedState(collapsed.value, index)\n}\nconst cloneItem = (index: number) => {\n setValue(cloneRepeaterItem(items.value, index))\n collapsed.value = cloneIndexedState(collapsed.value, index)\n}\n\nconst draggable = computed(\n () =>\n props.component.reorderable &&\n props.component.reorderableWithDragAndDrop !== false &&\n !disabled.value &&\n resolve('reorder') !== null,\n)\nconst buttons = computed(\n () =>\n props.component.reorderable &&\n props.component.reorderableWithButtons !== false &&\n !disabled.value,\n)\nconst setAllCollapsed = (value: boolean) => {\n collapsed.value = Object.fromEntries(items.value.map((_, index) => [index, value]))\n}\n\n// A drop runs the reorder action: in the browser, or on the server when customised.\nconst onDrop = (index: number) => {\n const from = dragIndex.value\n dragIndex.value = null\n if (from === null \|\| from === index) return\n runItemAction(\n resolve('reorder'),\n { items: reorderedItemKeys(items.value.length, from, index) },\n () => moveItem(from, index),\n )\n}\n\nconst add = () =>\n setValue(\n appendRepeaterItem(\n items.value,\n props.component.simple\n ? ({ [Object.keys(props.component.templateState)[0] ?? 'value']: null } as Record<\n string,\n unknown\n >)\n : props.component.templateState,\n ),\n )\n</script>\n\n<template>\n <!-- `deferLoading()`: a skeleton until the field scrolls into view. -->\n <DeferredSchema\n v-if=\"isDeferredPlaceholder(props.component)\"\n v-slot=\"{ component: loaded }\"\n :component=\"props.component\"\n >\n <RepeaterField :component=\"loaded\" />\n </DeferredSchema>\n <FieldWrapper v-else :field=\"props.component\" :html-for=\"id\" :error=\"error\">\n <div ref=\"moveContainer\" class=\"flex flex-col gap-3\">\n <span aria-live=\"polite\" aria-atomic=\"true\" class=\"sr-only\" data-slot=\"item-move-status\">{{\n moveAnnouncement\n }}</span>\n <RepeaterTable\n v-if=\"props.component.table?.length && !props.component.simple\"\n :id=\"id\"\n :columns=\"props.component.table\"\n :compact=\"props.component.compact\"\n :count=\"items.length\"\n :prefix-for=\"(index: number) => `${props.component.statePath}.${index}.`\"\n :schema-for=\"schemaFor\"\n :labelled-by=\"props.component.label ? fieldIds(id).label : undefined\"\n :described-by=\"aria['aria-describedby']\"\n :reorderable=\"buttons\"\n :cloneable=\"Boolean(props.component.cloneable) && canAdd\"\n :deletable=\"canDelete\"\n :virtual=\"virtual\"\n :context=\"context\"\n :resolve=\"resolve\"\n :extra-actions-for=\"(index: number) => props.component.items[index]?.actions\"\n @move=\"moveItem\"\n @clone=\"cloneItem\"\n @remove=\"removeItem\"\n />\n <CollapseAllActions\n v-if=\"\n !(props.component.table?.length && !props.component.simple) &&\n props.component.collapsible &&\n !props.component.simple &&\n items.length > 0\n \"\n :context=\"context\"\n :collapse-all=\"resolve('collapseAll')\"\n :expand-all=\"resolve('expandAll')\"\n @collapse-all=\"setAllCollapsed(true)\"\n @expand-all=\"setAllCollapsed(false)\"\n />\n <ul\n v-if=\"!(props.component.table?.length && !props.component.simple)\"\n :id=\"id\"\n :ref=\"virtual.attach\"\n :aria-labelledby=\"props.component.label ? fieldIds(id).label : undefined\"\n :aria-describedby=\"aria['aria-describedby']\"\n :style=\"virtual.style.value\"\n :class=\"cn('grid gap-3', props.component.grid && gridColumnsClasses(props.component.grid))\"\n >\n <li\n v-for=\"index in virtual.indexes.value\"\n :key=\"index\"\n :ref=\"virtual.item\"\n :data-index=\"index\"\n :aria-setsize=\"virtual.range.value.active ? items.length : undefined\"\n :aria-posinset=\"virtual.range.value.active ? index + 1 : undefined\"\n :draggable=\"draggable\"\n :class=\"\n cn(\n 'bg-card min-w-0 rounded-lg border shadow-xs',\n dragIndex === index && 'opacity-50',\n props.component.simple && 'border-0 shadow-none',\n )\n \"\n @dragstart=\"dragIndex = index\"\n @dragover=\"draggable && $event.preventDefault()\"\n @drop=\"onDrop(index)\"\n @dragend=\"dragIndex = null\"\n >\n <Collapsible :open=\"!isCollapsed(index)\">\n <div\n v-if=\"!props.component.simple\"\n class=\"flex flex-wrap items-center gap-1 border-b px-2 py-1.5\"\n data-slot=\"item-header\"\n >\n <span\n v-if=\"draggable\"\n class=\"text-muted-foreground cursor-grab\"\n :title=\"resolve('reorder')?.label ?? undefined\"\n aria-hidden=\"true\"\n ><Icon :name=\"resolve('reorder')?.icon ?? 'grip-vertical'\"\n /></span>\n <span\n v-if=\"props.component.itemNumbers\"\n class=\"text-muted-foreground text-xs tabular-nums\"\n >{{ formatter.number(index + 1) }}</span\n >\n <span\n v-if=\"props.component.items[index]?.label\"\n dir=\"auto\"\n class=\"min-w-0 truncate text-sm font-medium\"\n >{{ props.component.items[index]?.label }}</span\n >\n <span class=\"flex-1\" />\n <ItemHeaderActions\n :context=\"context\"\n :item-key=\"String(index)\"\n :index=\"index\"\n :count=\"items.length\"\n :resolve=\"(name: ItemActionName) => resolve(name, index)\"\n :extra-actions=\"disabled ? undefined : props.component.items[index]?.actions\"\n :buttons=\"buttons\"\n :can-clone=\"Boolean(props.component.cloneable) && canAdd\"\n :can-delete=\"canDelete\"\n :collapsible=\"Boolean(props.component.collapsible)\"\n :collapsed=\"isCollapsed(index)\"\n @move=\"moves.moveWithButton\"\n @clone=\"cloneItem(index)\"\n @delete=\"removeItem(index)\"\n @toggle=\"collapsed = { ...collapsed, [index]: !isCollapsed(index) }\"\n />\n </div>\n <CollapsibleContent>\n <div :class=\"cn('flex gap-2', props.component.simple ? 'items-start' : 'p-4')\">\n <div class=\"flex-1\">\n <SchemaRenderer\n :components=\"schemaFor(index)\"\n :columns=\"\n props.component.simple\n ? { default: 1 }\n : (props.component.columns ?? { default: 1, lg: 2 })\n \"\n :class=\"\n cn(\n props.component.simple && 'gap-0',\n '[&_[data-slot=field]_[data-slot=label]]:hidden',\n !props.component.simple && '[&_[data-slot=field]_[data-slot=label]]:flex',\n )\n \"\n />\n </div>\n <ItemActionButton\n v-if=\"props.component.simple && canDelete\"\n :action=\"resolve('delete', index)\"\n :context=\"context\"\n :args=\"{ item: String(index) }\"\n size=\"default\"\n class=\"text-muted-foreground\"\n @client=\"removeItem(index)\"\n />\n </div>\n </CollapsibleContent>\n </Collapsible>\n </li>\n </ul>\n <AddActionRow v-if=\"canAdd\" :alignment=\"props.component.addActionAlignment\">\n <ItemActionButton :action=\"resolve('add')\" :context=\"context\" size=\"sm\" @client=\"add\" />\n </AddActionRow>\n </div>\n </FieldWrapper>\n</template>\n"],"mappings":""}
1	+ {"version":3,"file":"RepeaterField.js","names":["_sfc_main","RepeaterField_vue_vue_type_script_setup_true_lang_default","RepeaterField_default"],"sources":["../../../src/components/fields/RepeaterField.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { RepeaterSchema, SchemaComponent } from '@alfakit/core'\nimport {\n isDeferredPlaceholder,\n VIRTUAL_ESTIMATES,\n appendRepeaterItem,\n fieldIds,\n cloneIndexedState,\n cloneRepeaterItem,\n gridColumnsClasses,\n moveIndexedState,\n moveRepeaterItem,\n removeIndexedState,\n removeRepeaterItem,\n reorderedItemKeys,\n templateForIndex,\n resolveItemAction,\n virtualizeOptions,\n type ItemActionName,\n} from '@alfakit/core'\nimport { computed, ref } from 'vue'\nimport { useScrollToErroredItem, useVirtualList } from '../../composables/use-virtual-list'\nimport { useFormatter } from '../../context'\nimport { Icon } from '../../lib/icons'\nimport { cn } from '../../lib/utils'\nimport DeferredSchema from '../layout/DeferredSchema.vue'\nimport { useField } from '../form/form-context'\nimport { useFieldActionContext } from '../schema/field-actions'\nimport FieldWrapper from '../schema/FieldWrapper.vue'\nimport SchemaRenderer from '../schema/SchemaRenderer.vue'\nimport Collapsible from '../ui/Collapsible.vue'\nimport CollapsibleContent from '../ui/CollapsibleContent.vue'\nimport AddActionRow from './AddActionRow.vue'\nimport CollapseAllActions from './CollapseAllActions.vue'\nimport ItemActionButton from './ItemActionButton.vue'\nimport ItemHeaderActions from './ItemHeaderActions.vue'\nimport { useItemActionFallbacks, useItemMoves, useRunItemAction } from './item-actions'\nimport RepeaterTable from './RepeaterTable.vue'\n\n/*\n Items use the per-index schema from the server when available (so closures see item\n * state) and fall back to the template for freshly added items.\n */\nconst props = defineProps<{ component: RepeaterSchema }>()\nconst formatter = useFormatter()\nconst context = useFieldActionContext(() => props.component)\nconst runItemAction = useRunItemAction(context)\nconst fallbacks = useItemActionFallbacks()\nconst resolve = (name: ItemActionName, index?: number) =>\n resolveItemAction(\n name,\n props.component,\n index === undefined ? undefined : props.component.items[index],\n name === 'add' ? { ...fallbacks.add, label: props.component.addActionLabel } : fallbacks[name],\n )\nconst {\n value,\n setValue,\n error,\n id,\n disabled: fieldDisabled,\n readOnly,\n aria,\n} = useField<unknown[] \| null>(() => props.component)\n// Read-only shows the items but hides add, delete, clone and reorder controls.\nconst disabled = computed(() => fieldDisabled.value \|\| readOnly.value)\nconst items = computed(() => value.value ?? [])\nconst collapsed = ref<Record<number, boolean>>({})\nconst dragIndex = ref<number \| null>(null)\n// Long lists render only the visible items (plus a few around them); a multi-column\n// `grid()` is windowed by whole rows, counting its columns from the rendered grid.\nconst virtual = useVirtualList(\n () => items.value.length,\n () =>\n virtualizeOptions(\n props.component.virtualize,\n VIRTUAL_ESTIMATES.item,\n 12,\n props.component.grid ? 'auto' : 1,\n ),\n)\nuseScrollToErroredItem(virtual, () => props.component.statePath)\n\nconst schemaFor = (index: number): SchemaComponent[] =>\n props.component.items[index]?.schema ?? templateForIndex(props.component.template, index)\nconst isCollapsed = (index: number) => collapsed.value[index] ?? props.component.collapsed ?? false\n\nconst canAdd = computed(\n () =>\n props.component.addable &&\n !disabled.value &&\n (props.component.maxItems == null \|\| items.value.length < props.component.maxItems),\n)\nconst canDelete = computed(\n () =>\n props.component.deletable &&\n !disabled.value &&\n (props.component.minItems == null \|\| items.value.length > props.component.minItems),\n)\n\n// Collapsed flags are keyed by index, so they move with their item.\nconst moveItem = (from: number, to: number) => {\n setValue(moveRepeaterItem(items.value, from, to))\n collapsed.value = moveIndexedState(collapsed.value, from, to)\n}\n// Move buttons: announced, one at a time, focus kept on the moved item.\nconst moves = useItemMoves(\n value,\n (from, to) => moveItem(from, to),\n (index) => props.component.items[index]?.label,\n () => items.value.length,\n)\nconst moveAnnouncement = moves.announcement\nconst moveContainer = moves.container\nconst removeItem = (index: number) => {\n setValue(removeRepeaterItem(items.value, index))\n collapsed.value = removeIndexedState(collapsed.value, index)\n}\nconst cloneItem = (index: number) => {\n setValue(cloneRepeaterItem(items.value, index))\n collapsed.value = cloneIndexedState(collapsed.value, index)\n}\n\nconst draggable = computed(\n () =>\n props.component.reorderable &&\n props.component.reorderableWithDragAndDrop !== false &&\n !disabled.value &&\n resolve('reorder') !== null,\n)\nconst buttons = computed(\n () =>\n props.component.reorderable &&\n props.component.reorderableWithButtons !== false &&\n !disabled.value,\n)\nconst setAllCollapsed = (value: boolean) => {\n collapsed.value = Object.fromEntries(items.value.map((_, index) => [index, value]))\n}\n\n// A drop runs the reorder action: in the browser, or on the server when customised.\nconst onDrop = (index: number) => {\n const from = dragIndex.value\n dragIndex.value = null\n if (from === null \|\| from === index) return\n runItemAction(\n resolve('reorder'),\n { items: reorderedItemKeys(items.value.length, from, index) },\n () => moveItem(from, index),\n )\n}\n\nconst add = () =>\n setValue(\n appendRepeaterItem(\n items.value,\n props.component.simple\n ? ({ [Object.keys(props.component.templateState)[0] ?? 'value']: null } as Record<\n string,\n unknown\n >)\n : props.component.templateState,\n ),\n )\n</script>\n\n<template>\n <!-- `deferLoading()`: a skeleton until the field scrolls into view. -->\n <DeferredSchema\n v-if=\"isDeferredPlaceholder(props.component)\"\n v-slot=\"{ component: loaded }\"\n :component=\"props.component\"\n >\n <RepeaterField :component=\"loaded\" />\n </DeferredSchema>\n <FieldWrapper v-else :field=\"props.component\" :html-for=\"id\" :error=\"error\">\n <div ref=\"moveContainer\" class=\"flex flex-col gap-3\">\n <span aria-live=\"polite\" aria-atomic=\"true\" class=\"sr-only\" data-slot=\"item-move-status\">{{\n moveAnnouncement\n }}</span>\n <RepeaterTable\n v-if=\"props.component.table?.length && !props.component.simple\"\n :id=\"id\"\n :columns=\"props.component.table\"\n :compact=\"props.component.compact\"\n :count=\"items.length\"\n :prefix-for=\"(index: number) => `${props.component.statePath}.${index}.`\"\n :schema-for=\"schemaFor\"\n :labelled-by=\"props.component.label ? fieldIds(id).label : undefined\"\n :described-by=\"aria['aria-describedby']\"\n :reorderable=\"buttons\"\n :cloneable=\"Boolean(props.component.cloneable) && canAdd\"\n :deletable=\"canDelete\"\n :virtual=\"virtual\"\n :context=\"context\"\n :resolve=\"resolve\"\n :extra-actions-for=\"(index: number) => props.component.items[index]?.actions\"\n @move=\"moveItem\"\n @clone=\"cloneItem\"\n @remove=\"removeItem\"\n />\n <CollapseAllActions\n v-if=\"\n !(props.component.table?.length && !props.component.simple) &&\n props.component.collapsible &&\n !props.component.simple &&\n items.length > 0\n \"\n :context=\"context\"\n :collapse-all=\"resolve('collapseAll')\"\n :expand-all=\"resolve('expandAll')\"\n @collapse-all=\"setAllCollapsed(true)\"\n @expand-all=\"setAllCollapsed(false)\"\n />\n <ul\n v-if=\"!(props.component.table?.length && !props.component.simple)\"\n :id=\"id\"\n :ref=\"virtual.attach\"\n :aria-labelledby=\"props.component.label ? fieldIds(id).label : undefined\"\n :aria-describedby=\"aria['aria-describedby']\"\n :style=\"virtual.style.value\"\n :class=\"cn('grid gap-3', props.component.grid && gridColumnsClasses(props.component.grid))\"\n >\n <li\n v-for=\"index in virtual.indexes.value\"\n :key=\"index\"\n :ref=\"virtual.item\"\n :data-index=\"index\"\n :aria-setsize=\"virtual.range.value.active ? items.length : undefined\"\n :aria-posinset=\"virtual.range.value.active ? index + 1 : undefined\"\n :draggable=\"draggable\"\n :class=\"\n cn(\n 'bg-card min-w-0 rounded-lg border shadow-xs',\n dragIndex === index && 'opacity-50',\n props.component.simple && 'border-0 shadow-none',\n )\n \"\n @dragstart=\"dragIndex = index\"\n @dragover=\"draggable && $event.preventDefault()\"\n @drop=\"onDrop(index)\"\n @dragend=\"dragIndex = null\"\n >\n <Collapsible :open=\"!isCollapsed(index)\">\n <div\n v-if=\"!props.component.simple\"\n class=\"flex flex-wrap items-center gap-1 border-b px-2 py-1.5\"\n data-slot=\"item-header\"\n >\n <span\n v-if=\"draggable\"\n class=\"text-muted-foreground cursor-grab\"\n :title=\"resolve('reorder')?.label ?? undefined\"\n aria-hidden=\"true\"\n ><Icon :name=\"resolve('reorder')?.icon ?? 'grip-vertical'\"\n /></span>\n <span\n v-if=\"props.component.itemNumbers\"\n class=\"text-muted-foreground text-xs tabular-nums\"\n >{{ formatter.number(index + 1) }}</span\n >\n <span\n v-if=\"props.component.items[index]?.label\"\n dir=\"auto\"\n class=\"min-w-0 truncate text-sm font-medium\"\n >{{ props.component.items[index]?.label }}</span\n >\n <span class=\"flex-1\" />\n <ItemHeaderActions\n :context=\"context\"\n :item-key=\"String(index)\"\n :index=\"index\"\n :count=\"items.length\"\n :resolve=\"(name: ItemActionName) => resolve(name, index)\"\n :extra-actions=\"disabled ? undefined : props.component.items[index]?.actions\"\n :buttons=\"buttons\"\n :can-clone=\"Boolean(props.component.cloneable) && canAdd\"\n :can-delete=\"canDelete\"\n :collapsible=\"Boolean(props.component.collapsible)\"\n :collapsed=\"isCollapsed(index)\"\n @move=\"moves.moveWithButton\"\n @clone=\"cloneItem(index)\"\n @delete=\"removeItem(index)\"\n @toggle=\"collapsed = { ...collapsed, [index]: !isCollapsed(index) }\"\n />\n </div>\n <CollapsibleContent>\n <div :class=\"cn('flex gap-2', props.component.simple ? 'items-start' : 'p-4')\">\n <div class=\"flex-1\">\n <SchemaRenderer\n :components=\"schemaFor(index)\"\n :columns=\"\n props.component.simple\n ? { default: 1 }\n : (props.component.columns ?? { default: 1, lg: 2 })\n \"\n :class=\"\n cn(\n props.component.simple && 'gap-0',\n '[&_[data-slot=field]_[data-slot=label]]:hidden',\n !props.component.simple && '[&_[data-slot=field]_[data-slot=label]]:flex',\n )\n \"\n />\n </div>\n <ItemActionButton\n v-if=\"props.component.simple && canDelete\"\n :action=\"resolve('delete', index)\"\n :context=\"context\"\n :args=\"{ item: String(index) }\"\n size=\"default\"\n class=\"text-muted-foreground\"\n @client=\"removeItem(index)\"\n />\n </div>\n </CollapsibleContent>\n </Collapsible>\n </li>\n </ul>\n <AddActionRow v-if=\"canAdd\" :alignment=\"props.component.addActionAlignment\">\n <ItemActionButton :action=\"resolve('add')\" :context=\"context\" size=\"sm\" @client=\"add\" />\n </AddActionRow>\n </div>\n </FieldWrapper>\n</template>\n"],"mappings":""}

package/dist/components/fields/RepeaterField.vue.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"RepeaterField.vue.d.ts","sourceRoot":"","sources":["../../../src/components/fields/RepeaterField.vue"],"names":[],"mappings":"~~AAwUA~~,OAAO,KAAK,EAAE,cAAc,EAAmB,MAAM,eAAe,CAAA;AAsCpE;;;GAGG;AACH,KAAK,WAAW,GAAG;IAAE,SAAS,EAAE,cAAc,CAAA;CAAE,CAAC;;~~AAgoBjD~~,wBAMG"}
1	+ {"version":3,"file":"RepeaterField.vue.d.ts","sourceRoot":"","sources":["../../../src/components/fields/RepeaterField.vue"],"names":[],"mappings":"AAuUA,OAAO,KAAK,EAAE,cAAc,EAAmB,MAAM,eAAe,CAAA;AAsCpE;;;GAGG;AACH,KAAK,WAAW,GAAG;IAAE,SAAS,EAAE,cAAc,CAAA;CAAE,CAAC;;AA+nBjD,wBAMG"}

package/dist/components/fields/RepeaterField.vue_vue_type_script_setup_true_lang.js CHANGED Viewed

@@ -4,18 +4,18 @@ import n from "../../lib/Icon.js";
 import { useField as r } from "../form/form-context.js";
 import ee from "../schema/SchemaRenderer.js";
 import { useScrollToErroredItem as i, useVirtualList as te } from "../../composables/use-virtual-list.js";
-import ne from "../ui/Collapsible.js";
-import re from "../ui/CollapsibleContent.js";
-import { useFieldActionContext as ie } from "../schema/field-actions.js";
-import ae from "../layout/DeferredSchema.js";
-import oe from "../schema/FieldWrapper.js";
+import { useFieldActionContext as ne } from "../schema/field-actions.js";
+import re from "../layout/DeferredSchema.js";
+import ie from "../schema/FieldWrapper.js";
+import ae from "../ui/Collapsible.js";
+import oe from "../ui/CollapsibleContent.js";
 import se from "./AddActionRow.js";
 import a from "./ItemActionButton.js";
 import ce from "./CollapseAllActions.js";
 import le from "./ItemHeaderActions.js";
 import { useItemActionFallbacks as o, useItemMoves as s, useRunItemAction as c } from "./item-actions.js";
 import l from "./RepeaterTable.js";
-import { VIRTUAL_ESTIMATES as u, appendRepeaterItem as ue, cloneIndexedState as de, cloneRepeaterItem as fe, fieldIds as d, gridColumnsClasses as pe, isDeferredPlaceholder as me, moveIndexedState as he, moveRepeaterItem as ge, removeIndexedState as _e, removeRepeaterItem as ve, reorderedItemKeys as ye, replacePlaceholder as be, resolveItemAction as xe, virtualizeOptions as Se } from "@alfakit/core";
+import { VIRTUAL_ESTIMATES as u, appendRepeaterItem as ue, cloneIndexedState as de, cloneRepeaterItem as fe, fieldIds as d, gridColumnsClasses as pe, isDeferredPlaceholder as me, moveIndexedState as he, moveRepeaterItem as ge, removeIndexedState as _e, removeRepeaterItem as ve, reorderedItemKeys as ye, resolveItemAction as be, templateForIndex as xe, virtualizeOptions as Se } from "@alfakit/core";
 import { Fragment as Ce, computed as f, createBlock as p, createCommentVNode as m, createElementBlock as h, createElementVNode as g, createVNode as _, defineComponent as v, normalizeClass as y, normalizeStyle as we, openBlock as b, ref as x, renderList as S, resolveComponent as C, toDisplayString as w, unref as T, withCtx as E } from "vue";
 //#region src/components/fields/RepeaterField.vue?vue&type=script&setup=true&lang.ts
 var D = {
@@ -49,12 +49,12 @@ var D = {
 	__name: "RepeaterField",
 	props: { component: {} },
 	setup(v) {
-		let A = v, Ae = e(), j = ie(() => A.component), je = c(j), M = o(), N = (e, t) => xe(e, A.component, t === void 0 ? void 0 : A.component.items[t], e === "add" ? {
+		let A = v, Ae = e(), j = ne(() => A.component), je = c(j), M = o(), N = (e, t) => be(e, A.component, t === void 0 ? void 0 : A.component.items[t], e === "add" ? {
 			...M.add,
 			label: A.component.addActionLabel
 		} : M[e]), { value: P, setValue: F, error: Me, id: I, disabled: Ne, readOnly: Pe, aria: L } = r(() => A.component), R = f(() => Ne.value || Pe.value), z = f(() => P.value ?? []), B = x({}), V = x(null), H = te(() => z.value.length, () => Se(A.component.virtualize, u.item, 12, A.component.grid ? "auto" : 1));
 		i(H, () => A.component.statePath);
-		let U = (e) => A.component.items[e]?.schema ?? be(A.component.template, "__INDEX__", String(e)), W = (e) => B.value[e] ?? A.component.collapsed ?? !1, G = f(() => A.component.addable && !R.value && (A.component.maxItems == null || z.value.length < A.component.maxItems)), K = f(() => A.component.deletable && !R.value && (A.component.minItems == null || z.value.length > A.component.minItems)), q = (e, t) => {
+		let U = (e) => A.component.items[e]?.schema ?? xe(A.component.template, e), W = (e) => B.value[e] ?? A.component.collapsed ?? !1, G = f(() => A.component.addable && !R.value && (A.component.maxItems == null || z.value.length < A.component.maxItems)), K = f(() => A.component.deletable && !R.value && (A.component.minItems == null || z.value.length > A.component.minItems)), q = (e, t) => {
 			F(ge(z.value, e, t)), B.value = he(B.value, e, t);
 		}, J = s(P, (e, t) => q(e, t), (e) => A.component.items[e]?.label, () => z.value.length), Fe = J.announcement, Ie = J.container, Y = (e) => {
 			F(ve(z.value, e)), B.value = _e(B.value, e);
@@ -68,13 +68,13 @@ var D = {
 		}, Re = () => F(ue(z.value, A.component.simple ? { [Object.keys(A.component.templateState)[0] ?? "value"]: null } : A.component.templateState));
 		return (e, r) => {
 			let i = C("RepeaterField", !0);
-			return T(me)(A.component) ? (b(), p(ae, {
+			return T(me)(A.component) ? (b(), p(re, {
 				key: 0,
 				component: A.component
 			}, {
 				default: E(({ component: e }) => [_(i, { component: e }, null, 8, ["component"])]),
 				_: 1
-			}, 8, ["component"])) : (b(), p(oe, {
+			}, 8, ["component"])) : (b(), p(ie, {
 				key: 1,
 				field: A.component,
 				"html-for": T(I),
@@ -154,7 +154,7 @@ var D = {
 						onDragover: r[2] ||= (e) => Z.value && e.preventDefault(),
 						onDrop: (t) => Le(e),
 						onDragend: r[3] ||= (e) => V.value = null
-					}, [_(ne, { open: !W(e) }, {
+					}, [_(ae, { open: !W(e) }, {
 						default: E(() => [A.component.simple ? m("", !0) : (b(), h("div", Te, [
 							Z.value ? (b(), h("span", {
 								key: 0,
@@ -201,7 +201,7 @@ var D = {
 								"onDelete",
 								"onToggle"
 							])
-						])), _(re, null, {
+						])), _(oe, null, {
 							default: E(() => [g("div", { class: y(T(t)("flex gap-2", A.component.simple ? "items-start" : "p-4")) }, [g("div", ke, [_(ee, {
 								components: U(e),
 								columns: A.component.simple ? { default: 1 } : A.component.columns ?? {

package/dist/components/fields/RepeaterField.vue_vue_type_script_setup_true_lang.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"RepeaterField.vue_vue_type_script_setup_true_lang.js","names":["_resolveComponent","_unref","_openBlock","_createBlock","DeferredSchema","_withCtx","_createVNode","FieldWrapper","_createElementVNode","_toDisplayString","RepeaterTable","_createCommentVNode","CollapseAllActions","_createElementBlock","_normalizeStyle","_normalizeClass","_Fragment","_renderList","Collapsible","Icon","ItemHeaderActions","CollapsibleContent","SchemaRenderer","ItemActionButton","AddActionRow","Icon_default","SchemaRenderer_default","Collapsible_default","CollapsibleContent_default","DeferredSchema_default","FieldWrapper_default","AddActionRow_default","ItemActionButton_default","CollapseAllActions_default","ItemHeaderActions_default","RepeaterTable_default","_hoisted_1","_hoisted_2","_hoisted_3","_hoisted_4","_hoisted_5","_hoisted_6","_hoisted_7","_hoisted_8","RepeaterField_vue_vue_type_script_setup_true_lang_default","props","__props","formatter","useFormatter","context","useFieldActionContext","runItemAction","useRunItemAction","fallbacks","useItemActionFallbacks","resolve","resolveItemAction","name","index","fieldDisabled","useField","disabled","computed","readOnly","items","value","collapsed","ref","dragIndex","virtual","useVirtualList","virtualizeOptions","VIRTUAL_ESTIMATES","schemaFor","replacePlaceholder","isCollapsed","canAdd","canDelete","moveItem","setValue","moveRepeaterItem","from","to","moveIndexedState","moves","useItemMoves","moveAnnouncement","moveContainer","removeItem","removeRepeaterItem","removeIndexedState","cloneItem","cloneRepeaterItem","cloneIndexedState","draggable","buttons","setAllCollapsed","onDrop","reorderedItemKeys","add","appendRepeaterItem","_component_RepeaterField","resolveComponent","unref","isDeferredPlaceholder","openBlock","createBlock","withCtx","loaded","createVNode","id","error","createElementVNode","toDisplayString","fieldIds","aria","createCommentVNode","_cache","createElementBlock","normalizeStyle","normalizeClass","cn","gridColumnsClasses","Fragment","renderList","$event"],"sources":["../../../src/components/fields/RepeaterField.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { RepeaterSchema, SchemaComponent } from '@alfakit/core'\nimport {\n isDeferredPlaceholder,\n VIRTUAL_ESTIMATES,\n appendRepeaterItem,\n fieldIds,\n cloneIndexedState,\n cloneRepeaterItem,\n gridColumnsClasses,\n moveIndexedState,\n moveRepeaterItem,\n removeIndexedState,\n removeRepeaterItem,\n reorderedItemKeys,\n replacePlaceholder,\n resolveItemAction,\n virtualizeOptions,\n type ItemActionName,\n} from '@alfakit/core'\nimport { computed, ref } from 'vue'\nimport { useScrollToErroredItem, useVirtualList } from '../../composables/use-virtual-list'\nimport { useFormatter } from '../../context'\nimport { Icon } from '../../lib/icons'\nimport { cn } from '../../lib/utils'\nimport DeferredSchema from '../layout/DeferredSchema.vue'\nimport { useField } from '../form/form-context'\nimport { useFieldActionContext } from '../schema/field-actions'\nimport FieldWrapper from '../schema/FieldWrapper.vue'\nimport SchemaRenderer from '../schema/SchemaRenderer.vue'\nimport Collapsible from '../ui/Collapsible.vue'\nimport CollapsibleContent from '../ui/CollapsibleContent.vue'\nimport AddActionRow from './AddActionRow.vue'\nimport CollapseAllActions from './CollapseAllActions.vue'\nimport ItemActionButton from './ItemActionButton.vue'\nimport ItemHeaderActions from './ItemHeaderActions.vue'\nimport { useItemActionFallbacks, useItemMoves, useRunItemAction } from './item-actions'\nimport RepeaterTable from './RepeaterTable.vue'\n\n/*\n Items use the per-index schema from the server when available (so closures see item\n * state) and fall back to the template for freshly added items.\n */\nconst props = defineProps<{ component: RepeaterSchema }>()\nconst formatter = useFormatter()\nconst context = useFieldActionContext(() => props.component)\nconst runItemAction = useRunItemAction(context)\nconst fallbacks = useItemActionFallbacks()\nconst resolve = (name: ItemActionName, index?: number) =>\n resolveItemAction(\n name,\n props.component,\n index === undefined ? undefined : props.component.items[index],\n name === 'add' ? { ...fallbacks.add, label: props.component.addActionLabel } : fallbacks[name],\n )\nconst {\n value,\n setValue,\n error,\n id,\n disabled: fieldDisabled,\n readOnly,\n aria,\n} = useField<unknown[] \| null>(() => props.component)\n// Read-only shows the items but hides add, delete, clone and reorder controls.\nconst disabled = computed(() => fieldDisabled.value \|\| readOnly.value)\nconst items = computed(() => value.value ?? [])\nconst collapsed = ref<Record<number, boolean>>({})\nconst dragIndex = ref<number \| null>(null)\n// Long lists render only the visible items (plus a few around them); a multi-column\n// `grid()` is windowed by whole rows, counting its columns from the rendered grid.\nconst virtual = useVirtualList(\n () => items.value.length,\n () =>\n virtualizeOptions(\n props.component.virtualize,\n VIRTUAL_ESTIMATES.item,\n 12,\n props.component.grid ? 'auto' : 1,\n ),\n)\nuseScrollToErroredItem(virtual, () => props.component.statePath)\n\nconst schemaFor = (index: number): SchemaComponent[] =>\n props.component.items[index]?.schema ??\n replacePlaceholder(props.component.template, '__INDEX__', String(index))\nconst isCollapsed = (index: number) => collapsed.value[index] ?? props.component.collapsed ?? false\n\nconst canAdd = computed(\n () =>\n props.component.addable &&\n !disabled.value &&\n (props.component.maxItems == null \|\| items.value.length < props.component.maxItems),\n)\nconst canDelete = computed(\n () =>\n props.component.deletable &&\n !disabled.value &&\n (props.component.minItems == null \|\| items.value.length > props.component.minItems),\n)\n\n// Collapsed flags are keyed by index, so they move with their item.\nconst moveItem = (from: number, to: number) => {\n setValue(moveRepeaterItem(items.value, from, to))\n collapsed.value = moveIndexedState(collapsed.value, from, to)\n}\n// Move buttons: announced, one at a time, focus kept on the moved item.\nconst moves = useItemMoves(\n value,\n (from, to) => moveItem(from, to),\n (index) => props.component.items[index]?.label,\n () => items.value.length,\n)\nconst moveAnnouncement = moves.announcement\nconst moveContainer = moves.container\nconst removeItem = (index: number) => {\n setValue(removeRepeaterItem(items.value, index))\n collapsed.value = removeIndexedState(collapsed.value, index)\n}\nconst cloneItem = (index: number) => {\n setValue(cloneRepeaterItem(items.value, index))\n collapsed.value = cloneIndexedState(collapsed.value, index)\n}\n\nconst draggable = computed(\n () =>\n props.component.reorderable &&\n props.component.reorderableWithDragAndDrop !== false &&\n !disabled.value &&\n resolve('reorder') !== null,\n)\nconst buttons = computed(\n () =>\n props.component.reorderable &&\n props.component.reorderableWithButtons !== false &&\n !disabled.value,\n)\nconst setAllCollapsed = (value: boolean) => {\n collapsed.value = Object.fromEntries(items.value.map((_, index) => [index, value]))\n}\n\n// A drop runs the reorder action: in the browser, or on the server when customised.\nconst onDrop = (index: number) => {\n const from = dragIndex.value\n dragIndex.value = null\n if (from === null \|\| from === index) return\n runItemAction(\n resolve('reorder'),\n { items: reorderedItemKeys(items.value.length, from, index) },\n () => moveItem(from, index),\n )\n}\n\nconst add = () =>\n setValue(\n appendRepeaterItem(\n items.value,\n props.component.simple\n ? ({ [Object.keys(props.component.templateState)[0] ?? 'value']: null } as Record<\n string,\n unknown\n >)\n : props.component.templateState,\n ),\n )\n</script>\n\n<template>\n <!-- `deferLoading()`: a skeleton until the field scrolls into view. -->\n <DeferredSchema\n v-if=\"isDeferredPlaceholder(props.component)\"\n v-slot=\"{ component: loaded }\"\n :component=\"props.component\"\n >\n <RepeaterField :component=\"loaded\" />\n </DeferredSchema>\n <FieldWrapper v-else :field=\"props.component\" :html-for=\"id\" :error=\"error\">\n <div ref=\"moveContainer\" class=\"flex flex-col gap-3\">\n <span aria-live=\"polite\" aria-atomic=\"true\" class=\"sr-only\" data-slot=\"item-move-status\">{{\n moveAnnouncement\n }}</span>\n <RepeaterTable\n v-if=\"props.component.table?.length && !props.component.simple\"\n :id=\"id\"\n :columns=\"props.component.table\"\n :compact=\"props.component.compact\"\n :count=\"items.length\"\n :prefix-for=\"(index: number) => `${props.component.statePath}.${index}.`\"\n :schema-for=\"schemaFor\"\n :labelled-by=\"props.component.label ? fieldIds(id).label : undefined\"\n :described-by=\"aria['aria-describedby']\"\n :reorderable=\"buttons\"\n :cloneable=\"Boolean(props.component.cloneable) && canAdd\"\n :deletable=\"canDelete\"\n :virtual=\"virtual\"\n :context=\"context\"\n :resolve=\"resolve\"\n :extra-actions-for=\"(index: number) => props.component.items[index]?.actions\"\n @move=\"moveItem\"\n @clone=\"cloneItem\"\n @remove=\"removeItem\"\n />\n <CollapseAllActions\n v-if=\"\n !(props.component.table?.length && !props.component.simple) &&\n props.component.collapsible &&\n !props.component.simple &&\n items.length > 0\n \"\n :context=\"context\"\n :collapse-all=\"resolve('collapseAll')\"\n :expand-all=\"resolve('expandAll')\"\n @collapse-all=\"setAllCollapsed(true)\"\n @expand-all=\"setAllCollapsed(false)\"\n />\n <ul\n v-if=\"!(props.component.table?.length && !props.component.simple)\"\n :id=\"id\"\n :ref=\"virtual.attach\"\n :aria-labelledby=\"props.component.label ? fieldIds(id).label : undefined\"\n :aria-describedby=\"aria['aria-describedby']\"\n :style=\"virtual.style.value\"\n :class=\"cn('grid gap-3', props.component.grid && gridColumnsClasses(props.component.grid))\"\n >\n <li\n v-for=\"index in virtual.indexes.value\"\n :key=\"index\"\n :ref=\"virtual.item\"\n :data-index=\"index\"\n :aria-setsize=\"virtual.range.value.active ? items.length : undefined\"\n :aria-posinset=\"virtual.range.value.active ? index + 1 : undefined\"\n :draggable=\"draggable\"\n :class=\"\n cn(\n 'bg-card min-w-0 rounded-lg border shadow-xs',\n dragIndex === index && 'opacity-50',\n props.component.simple && 'border-0 shadow-none',\n )\n \"\n @dragstart=\"dragIndex = index\"\n @dragover=\"draggable && $event.preventDefault()\"\n @drop=\"onDrop(index)\"\n @dragend=\"dragIndex = null\"\n >\n <Collapsible :open=\"!isCollapsed(index)\">\n <div\n v-if=\"!props.component.simple\"\n class=\"flex flex-wrap items-center gap-1 border-b px-2 py-1.5\"\n data-slot=\"item-header\"\n >\n <span\n v-if=\"draggable\"\n class=\"text-muted-foreground cursor-grab\"\n :title=\"resolve('reorder')?.label ?? undefined\"\n aria-hidden=\"true\"\n ><Icon :name=\"resolve('reorder')?.icon ?? 'grip-vertical'\"\n /></span>\n <span\n v-if=\"props.component.itemNumbers\"\n class=\"text-muted-foreground text-xs tabular-nums\"\n >{{ formatter.number(index + 1) }}</span\n >\n <span\n v-if=\"props.component.items[index]?.label\"\n dir=\"auto\"\n class=\"min-w-0 truncate text-sm font-medium\"\n >{{ props.component.items[index]?.label }}</span\n >\n <span class=\"flex-1\" />\n <ItemHeaderActions\n :context=\"context\"\n :item-key=\"String(index)\"\n :index=\"index\"\n :count=\"items.length\"\n :resolve=\"(name: ItemActionName) => resolve(name, index)\"\n :extra-actions=\"disabled ? undefined : props.component.items[index]?.actions\"\n :buttons=\"buttons\"\n :can-clone=\"Boolean(props.component.cloneable) && canAdd\"\n :can-delete=\"canDelete\"\n :collapsible=\"Boolean(props.component.collapsible)\"\n :collapsed=\"isCollapsed(index)\"\n @move=\"moves.moveWithButton\"\n @clone=\"cloneItem(index)\"\n @delete=\"removeItem(index)\"\n @toggle=\"collapsed = { ...collapsed, [index]: !isCollapsed(index) }\"\n />\n </div>\n <CollapsibleContent>\n <div :class=\"cn('flex gap-2', props.component.simple ? 'items-start' : 'p-4')\">\n <div class=\"flex-1\">\n <SchemaRenderer\n :components=\"schemaFor(index)\"\n :columns=\"\n props.component.simple\n ? { default: 1 }\n : (props.component.columns ?? { default: 1, lg: 2 })\n \"\n :class=\"\n cn(\n props.component.simple && 'gap-0',\n '[&_[data-slot=field]_[data-slot=label]]:hidden',\n !props.component.simple && '[&_[data-slot=field]_[data-slot=label]]:flex',\n )\n \"\n />\n </div>\n <ItemActionButton\n v-if=\"props.component.simple && canDelete\"\n :action=\"resolve('delete', index)\"\n :context=\"context\"\n :args=\"{ item: String(index) }\"\n size=\"default\"\n class=\"text-muted-foreground\"\n @client=\"removeItem(index)\"\n />\n </div>\n </CollapsibleContent>\n </Collapsible>\n </li>\n </ul>\n <AddActionRow v-if=\"canAdd\" :alignment=\"props.component.addActionAlignment\">\n <ItemActionButton :action=\"resolve('add')\" :context=\"context\" size=\"sm\" @client=\"add\" />\n </AddActionRow>\n </div>\n </FieldWrapper>\n</template>\n"],"mappings":"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"}
1	+ {"version":3,"file":"RepeaterField.vue_vue_type_script_setup_true_lang.js","names":["_resolveComponent","_unref","_openBlock","_createBlock","DeferredSchema","_withCtx","_createVNode","FieldWrapper","_createElementVNode","_toDisplayString","RepeaterTable","_createCommentVNode","CollapseAllActions","_createElementBlock","_normalizeStyle","_normalizeClass","_Fragment","_renderList","Collapsible","Icon","ItemHeaderActions","CollapsibleContent","SchemaRenderer","ItemActionButton","AddActionRow","Icon_default","SchemaRenderer_default","DeferredSchema_default","FieldWrapper_default","Collapsible_default","CollapsibleContent_default","AddActionRow_default","ItemActionButton_default","CollapseAllActions_default","ItemHeaderActions_default","RepeaterTable_default","_hoisted_1","_hoisted_2","_hoisted_3","_hoisted_4","_hoisted_5","_hoisted_6","_hoisted_7","_hoisted_8","RepeaterField_vue_vue_type_script_setup_true_lang_default","props","__props","formatter","useFormatter","context","useFieldActionContext","runItemAction","useRunItemAction","fallbacks","useItemActionFallbacks","resolve","resolveItemAction","name","index","fieldDisabled","useField","disabled","computed","readOnly","items","value","collapsed","ref","dragIndex","virtual","useVirtualList","virtualizeOptions","VIRTUAL_ESTIMATES","schemaFor","templateForIndex","isCollapsed","canAdd","canDelete","moveItem","setValue","moveRepeaterItem","from","to","moveIndexedState","moves","useItemMoves","moveAnnouncement","moveContainer","removeItem","removeRepeaterItem","removeIndexedState","cloneItem","cloneRepeaterItem","cloneIndexedState","draggable","buttons","setAllCollapsed","onDrop","reorderedItemKeys","add","appendRepeaterItem","_component_RepeaterField","resolveComponent","unref","isDeferredPlaceholder","openBlock","createBlock","withCtx","loaded","createVNode","id","error","createElementVNode","toDisplayString","fieldIds","aria","createCommentVNode","_cache","createElementBlock","normalizeStyle","normalizeClass","cn","gridColumnsClasses","Fragment","renderList","$event"],"sources":["../../../src/components/fields/RepeaterField.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { RepeaterSchema, SchemaComponent } from '@alfakit/core'\nimport {\n isDeferredPlaceholder,\n VIRTUAL_ESTIMATES,\n appendRepeaterItem,\n fieldIds,\n cloneIndexedState,\n cloneRepeaterItem,\n gridColumnsClasses,\n moveIndexedState,\n moveRepeaterItem,\n removeIndexedState,\n removeRepeaterItem,\n reorderedItemKeys,\n templateForIndex,\n resolveItemAction,\n virtualizeOptions,\n type ItemActionName,\n} from '@alfakit/core'\nimport { computed, ref } from 'vue'\nimport { useScrollToErroredItem, useVirtualList } from '../../composables/use-virtual-list'\nimport { useFormatter } from '../../context'\nimport { Icon } from '../../lib/icons'\nimport { cn } from '../../lib/utils'\nimport DeferredSchema from '../layout/DeferredSchema.vue'\nimport { useField } from '../form/form-context'\nimport { useFieldActionContext } from '../schema/field-actions'\nimport FieldWrapper from '../schema/FieldWrapper.vue'\nimport SchemaRenderer from '../schema/SchemaRenderer.vue'\nimport Collapsible from '../ui/Collapsible.vue'\nimport CollapsibleContent from '../ui/CollapsibleContent.vue'\nimport AddActionRow from './AddActionRow.vue'\nimport CollapseAllActions from './CollapseAllActions.vue'\nimport ItemActionButton from './ItemActionButton.vue'\nimport ItemHeaderActions from './ItemHeaderActions.vue'\nimport { useItemActionFallbacks, useItemMoves, useRunItemAction } from './item-actions'\nimport RepeaterTable from './RepeaterTable.vue'\n\n/*\n Items use the per-index schema from the server when available (so closures see item\n * state) and fall back to the template for freshly added items.\n */\nconst props = defineProps<{ component: RepeaterSchema }>()\nconst formatter = useFormatter()\nconst context = useFieldActionContext(() => props.component)\nconst runItemAction = useRunItemAction(context)\nconst fallbacks = useItemActionFallbacks()\nconst resolve = (name: ItemActionName, index?: number) =>\n resolveItemAction(\n name,\n props.component,\n index === undefined ? undefined : props.component.items[index],\n name === 'add' ? { ...fallbacks.add, label: props.component.addActionLabel } : fallbacks[name],\n )\nconst {\n value,\n setValue,\n error,\n id,\n disabled: fieldDisabled,\n readOnly,\n aria,\n} = useField<unknown[] \| null>(() => props.component)\n// Read-only shows the items but hides add, delete, clone and reorder controls.\nconst disabled = computed(() => fieldDisabled.value \|\| readOnly.value)\nconst items = computed(() => value.value ?? [])\nconst collapsed = ref<Record<number, boolean>>({})\nconst dragIndex = ref<number \| null>(null)\n// Long lists render only the visible items (plus a few around them); a multi-column\n// `grid()` is windowed by whole rows, counting its columns from the rendered grid.\nconst virtual = useVirtualList(\n () => items.value.length,\n () =>\n virtualizeOptions(\n props.component.virtualize,\n VIRTUAL_ESTIMATES.item,\n 12,\n props.component.grid ? 'auto' : 1,\n ),\n)\nuseScrollToErroredItem(virtual, () => props.component.statePath)\n\nconst schemaFor = (index: number): SchemaComponent[] =>\n props.component.items[index]?.schema ?? templateForIndex(props.component.template, index)\nconst isCollapsed = (index: number) => collapsed.value[index] ?? props.component.collapsed ?? false\n\nconst canAdd = computed(\n () =>\n props.component.addable &&\n !disabled.value &&\n (props.component.maxItems == null \|\| items.value.length < props.component.maxItems),\n)\nconst canDelete = computed(\n () =>\n props.component.deletable &&\n !disabled.value &&\n (props.component.minItems == null \|\| items.value.length > props.component.minItems),\n)\n\n// Collapsed flags are keyed by index, so they move with their item.\nconst moveItem = (from: number, to: number) => {\n setValue(moveRepeaterItem(items.value, from, to))\n collapsed.value = moveIndexedState(collapsed.value, from, to)\n}\n// Move buttons: announced, one at a time, focus kept on the moved item.\nconst moves = useItemMoves(\n value,\n (from, to) => moveItem(from, to),\n (index) => props.component.items[index]?.label,\n () => items.value.length,\n)\nconst moveAnnouncement = moves.announcement\nconst moveContainer = moves.container\nconst removeItem = (index: number) => {\n setValue(removeRepeaterItem(items.value, index))\n collapsed.value = removeIndexedState(collapsed.value, index)\n}\nconst cloneItem = (index: number) => {\n setValue(cloneRepeaterItem(items.value, index))\n collapsed.value = cloneIndexedState(collapsed.value, index)\n}\n\nconst draggable = computed(\n () =>\n props.component.reorderable &&\n props.component.reorderableWithDragAndDrop !== false &&\n !disabled.value &&\n resolve('reorder') !== null,\n)\nconst buttons = computed(\n () =>\n props.component.reorderable &&\n props.component.reorderableWithButtons !== false &&\n !disabled.value,\n)\nconst setAllCollapsed = (value: boolean) => {\n collapsed.value = Object.fromEntries(items.value.map((_, index) => [index, value]))\n}\n\n// A drop runs the reorder action: in the browser, or on the server when customised.\nconst onDrop = (index: number) => {\n const from = dragIndex.value\n dragIndex.value = null\n if (from === null \|\| from === index) return\n runItemAction(\n resolve('reorder'),\n { items: reorderedItemKeys(items.value.length, from, index) },\n () => moveItem(from, index),\n )\n}\n\nconst add = () =>\n setValue(\n appendRepeaterItem(\n items.value,\n props.component.simple\n ? ({ [Object.keys(props.component.templateState)[0] ?? 'value']: null } as Record<\n string,\n unknown\n >)\n : props.component.templateState,\n ),\n )\n</script>\n\n<template>\n <!-- `deferLoading()`: a skeleton until the field scrolls into view. -->\n <DeferredSchema\n v-if=\"isDeferredPlaceholder(props.component)\"\n v-slot=\"{ component: loaded }\"\n :component=\"props.component\"\n >\n <RepeaterField :component=\"loaded\" />\n </DeferredSchema>\n <FieldWrapper v-else :field=\"props.component\" :html-for=\"id\" :error=\"error\">\n <div ref=\"moveContainer\" class=\"flex flex-col gap-3\">\n <span aria-live=\"polite\" aria-atomic=\"true\" class=\"sr-only\" data-slot=\"item-move-status\">{{\n moveAnnouncement\n }}</span>\n <RepeaterTable\n v-if=\"props.component.table?.length && !props.component.simple\"\n :id=\"id\"\n :columns=\"props.component.table\"\n :compact=\"props.component.compact\"\n :count=\"items.length\"\n :prefix-for=\"(index: number) => `${props.component.statePath}.${index}.`\"\n :schema-for=\"schemaFor\"\n :labelled-by=\"props.component.label ? fieldIds(id).label : undefined\"\n :described-by=\"aria['aria-describedby']\"\n :reorderable=\"buttons\"\n :cloneable=\"Boolean(props.component.cloneable) && canAdd\"\n :deletable=\"canDelete\"\n :virtual=\"virtual\"\n :context=\"context\"\n :resolve=\"resolve\"\n :extra-actions-for=\"(index: number) => props.component.items[index]?.actions\"\n @move=\"moveItem\"\n @clone=\"cloneItem\"\n @remove=\"removeItem\"\n />\n <CollapseAllActions\n v-if=\"\n !(props.component.table?.length && !props.component.simple) &&\n props.component.collapsible &&\n !props.component.simple &&\n items.length > 0\n \"\n :context=\"context\"\n :collapse-all=\"resolve('collapseAll')\"\n :expand-all=\"resolve('expandAll')\"\n @collapse-all=\"setAllCollapsed(true)\"\n @expand-all=\"setAllCollapsed(false)\"\n />\n <ul\n v-if=\"!(props.component.table?.length && !props.component.simple)\"\n :id=\"id\"\n :ref=\"virtual.attach\"\n :aria-labelledby=\"props.component.label ? fieldIds(id).label : undefined\"\n :aria-describedby=\"aria['aria-describedby']\"\n :style=\"virtual.style.value\"\n :class=\"cn('grid gap-3', props.component.grid && gridColumnsClasses(props.component.grid))\"\n >\n <li\n v-for=\"index in virtual.indexes.value\"\n :key=\"index\"\n :ref=\"virtual.item\"\n :data-index=\"index\"\n :aria-setsize=\"virtual.range.value.active ? items.length : undefined\"\n :aria-posinset=\"virtual.range.value.active ? index + 1 : undefined\"\n :draggable=\"draggable\"\n :class=\"\n cn(\n 'bg-card min-w-0 rounded-lg border shadow-xs',\n dragIndex === index && 'opacity-50',\n props.component.simple && 'border-0 shadow-none',\n )\n \"\n @dragstart=\"dragIndex = index\"\n @dragover=\"draggable && $event.preventDefault()\"\n @drop=\"onDrop(index)\"\n @dragend=\"dragIndex = null\"\n >\n <Collapsible :open=\"!isCollapsed(index)\">\n <div\n v-if=\"!props.component.simple\"\n class=\"flex flex-wrap items-center gap-1 border-b px-2 py-1.5\"\n data-slot=\"item-header\"\n >\n <span\n v-if=\"draggable\"\n class=\"text-muted-foreground cursor-grab\"\n :title=\"resolve('reorder')?.label ?? undefined\"\n aria-hidden=\"true\"\n ><Icon :name=\"resolve('reorder')?.icon ?? 'grip-vertical'\"\n /></span>\n <span\n v-if=\"props.component.itemNumbers\"\n class=\"text-muted-foreground text-xs tabular-nums\"\n >{{ formatter.number(index + 1) }}</span\n >\n <span\n v-if=\"props.component.items[index]?.label\"\n dir=\"auto\"\n class=\"min-w-0 truncate text-sm font-medium\"\n >{{ props.component.items[index]?.label }}</span\n >\n <span class=\"flex-1\" />\n <ItemHeaderActions\n :context=\"context\"\n :item-key=\"String(index)\"\n :index=\"index\"\n :count=\"items.length\"\n :resolve=\"(name: ItemActionName) => resolve(name, index)\"\n :extra-actions=\"disabled ? undefined : props.component.items[index]?.actions\"\n :buttons=\"buttons\"\n :can-clone=\"Boolean(props.component.cloneable) && canAdd\"\n :can-delete=\"canDelete\"\n :collapsible=\"Boolean(props.component.collapsible)\"\n :collapsed=\"isCollapsed(index)\"\n @move=\"moves.moveWithButton\"\n @clone=\"cloneItem(index)\"\n @delete=\"removeItem(index)\"\n @toggle=\"collapsed = { ...collapsed, [index]: !isCollapsed(index) }\"\n />\n </div>\n <CollapsibleContent>\n <div :class=\"cn('flex gap-2', props.component.simple ? 'items-start' : 'p-4')\">\n <div class=\"flex-1\">\n <SchemaRenderer\n :components=\"schemaFor(index)\"\n :columns=\"\n props.component.simple\n ? { default: 1 }\n : (props.component.columns ?? { default: 1, lg: 2 })\n \"\n :class=\"\n cn(\n props.component.simple && 'gap-0',\n '[&_[data-slot=field]_[data-slot=label]]:hidden',\n !props.component.simple && '[&_[data-slot=field]_[data-slot=label]]:flex',\n )\n \"\n />\n </div>\n <ItemActionButton\n v-if=\"props.component.simple && canDelete\"\n :action=\"resolve('delete', index)\"\n :context=\"context\"\n :args=\"{ item: String(index) }\"\n size=\"default\"\n class=\"text-muted-foreground\"\n @client=\"removeItem(index)\"\n />\n </div>\n </CollapsibleContent>\n </Collapsible>\n </li>\n </ul>\n <AddActionRow v-if=\"canAdd\" :alignment=\"props.component.addActionAlignment\">\n <ItemActionButton :action=\"resolve('add')\" :context=\"context\" size=\"sm\" @client=\"add\" />\n </AddActionRow>\n </div>\n </FieldWrapper>\n</template>\n"],"mappings":"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"}