@leavepulse/ui 0.86.0 → 0.86.1
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.
- package/README.md +367 -72
- package/dist/assets/{LpTable-ChCcmmtT.css → LpTable-CEFsRz5J.css} +19 -19
- package/dist/components/LpTable.vue.js +343 -335
- package/package.json +3 -2
- package/src/components/LpTable.vue +12 -0
|
@@ -32,7 +32,7 @@ import { toCsv, downloadFile, fileStem } from "./exportData.js";
|
|
|
32
32
|
import { toHiddenSets, sameHidden, summarizeShown, parseTableState, mergeRestored, serializeTableState, fromHiddenSets } from "./tableFilter.js";
|
|
33
33
|
import { resolveRowMenu } from "./tableRowMenu.js";
|
|
34
34
|
import { _ as _export_sfc } from "../chunks/_plugin-vue_export-helper-1tPrXgE0.js";
|
|
35
|
-
import '../assets/LpTable-
|
|
35
|
+
import '../assets/LpTable-CEFsRz5J.css';const _hoisted_1 = {
|
|
36
36
|
key: 0,
|
|
37
37
|
class: "flex min-h-8 flex-wrap items-center gap-x-3 gap-y-2 pb-3 text-xs"
|
|
38
38
|
};
|
|
@@ -1088,364 +1088,372 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
|
1088
1088
|
]),
|
|
1089
1089
|
_: 3
|
|
1090
1090
|
}),
|
|
1091
|
-
createVNode(_sfc_main$
|
|
1092
|
-
|
|
1093
|
-
class: "min-h-0 flex-
|
|
1094
|
-
|
|
1095
|
-
"bar-inset-top": barInsetTop.value
|
|
1096
|
-
}), {
|
|
1091
|
+
createVNode(_sfc_main$2, {
|
|
1092
|
+
disabled: !!__props.virtualRowHeight,
|
|
1093
|
+
class: "flex min-h-0 flex-auto flex-col"
|
|
1094
|
+
}, {
|
|
1097
1095
|
default: withCtx(() => [
|
|
1098
|
-
createVNode(_sfc_main$
|
|
1099
|
-
|
|
1100
|
-
|
|
1101
|
-
|
|
1102
|
-
|
|
1103
|
-
|
|
1104
|
-
"title-icon": menuHead.value?.icon,
|
|
1105
|
-
"title-image": menuHead.value?.image
|
|
1106
|
-
}, {
|
|
1096
|
+
createVNode(_sfc_main$7, mergeProps(scrollAttrs.value, {
|
|
1097
|
+
fade: false,
|
|
1098
|
+
class: "min-h-0 flex-1 rounded-card border border-line bg-surface",
|
|
1099
|
+
style: __props.load && floor.value ? { minHeight: `${floor.value + 2}px` } : void 0,
|
|
1100
|
+
"bar-inset-top": barInsetTop.value
|
|
1101
|
+
}), {
|
|
1107
1102
|
default: withCtx(() => [
|
|
1108
|
-
|
|
1109
|
-
|
|
1110
|
-
|
|
1111
|
-
|
|
1112
|
-
|
|
1113
|
-
|
|
1114
|
-
|
|
1115
|
-
|
|
1116
|
-
|
|
1117
|
-
|
|
1118
|
-
|
|
1119
|
-
|
|
1120
|
-
|
|
1121
|
-
|
|
1122
|
-
|
|
1123
|
-
|
|
1124
|
-
|
|
1125
|
-
|
|
1126
|
-
|
|
1127
|
-
|
|
1128
|
-
class: normalizeClass(
|
|
1129
|
-
style: normalizeStyle(fixedLayout.value ? { width: ticksShown.value ? TICK_COLUMN_WIDTH : "0" } : void 0)
|
|
1103
|
+
createVNode(_sfc_main$8, {
|
|
1104
|
+
items: contextMenu.value,
|
|
1105
|
+
always: "",
|
|
1106
|
+
"no-hint": !__props.rowMenu,
|
|
1107
|
+
title: menuHead.value?.title,
|
|
1108
|
+
subtitle: menuHead.value?.subtitle,
|
|
1109
|
+
"title-icon": menuHead.value?.icon,
|
|
1110
|
+
"title-image": menuHead.value?.image
|
|
1111
|
+
}, {
|
|
1112
|
+
default: withCtx(() => [
|
|
1113
|
+
createElementVNode("table", {
|
|
1114
|
+
ref_key: "tableEl",
|
|
1115
|
+
ref: tableEl,
|
|
1116
|
+
class: normalizeClass(["w-full border-collapse text-sm", fixedLayout.value ? "table-fixed" : ""]),
|
|
1117
|
+
style: normalizeStyle(tableStyle.value),
|
|
1118
|
+
"aria-rowcount": __props.virtualRowHeight ? allEntries.value.length + 1 : void 0
|
|
1119
|
+
}, [
|
|
1120
|
+
createElementVNode("thead", {
|
|
1121
|
+
ref_key: "headEl",
|
|
1122
|
+
ref: headEl,
|
|
1123
|
+
class: normalizeClass(__props.stickyHeader ? "sticky top-0 z-10 bg-surface-soft" : "")
|
|
1130
1124
|
}, [
|
|
1131
|
-
createElementVNode("
|
|
1132
|
-
|
|
1133
|
-
inert: !ticksShown.value
|
|
1134
|
-
}, [
|
|
1135
|
-
createVNode(_sfc_main$9, {
|
|
1136
|
-
"model-value": allChecked.value,
|
|
1137
|
-
indeterminate: someChecked.value,
|
|
1138
|
-
"onUpdate:modelValue": toggleAll
|
|
1139
|
-
}, null, 8, ["model-value", "indeterminate"])
|
|
1140
|
-
], 10, _hoisted_12)
|
|
1141
|
-
], 6)) : createCommentVNode("", true),
|
|
1142
|
-
(openBlock(true), createElementBlock(Fragment, null, renderList(shownColumns.value, (col) => {
|
|
1143
|
-
return openBlock(), createElementBlock("th", {
|
|
1144
|
-
key: col.key,
|
|
1145
|
-
style: normalizeStyle(headStyle(col)),
|
|
1146
|
-
class: normalizeClass(["px-4 text-[11px] font-semibold uppercase tracking-[0.08em] text-muted", [alignClass(col.align), cellY.value, col.pin ? PIN_HEAD : "", canResize(col) && !col.pin ? "relative" : ""]]),
|
|
1147
|
-
"data-lp-col": measuredCol(col),
|
|
1148
|
-
"aria-sort": sortOf(col) ? sortOf(col).dir === "asc" ? "ascending" : "descending" : void 0
|
|
1149
|
-
}, [
|
|
1150
|
-
col.sortable || col.filterable ? (openBlock(), createBlock(_sfc_main$8, {
|
|
1125
|
+
createElementVNode("tr", _hoisted_11, [
|
|
1126
|
+
expansionOn.value ? (openBlock(), createElementBlock("th", {
|
|
1151
1127
|
key: 0,
|
|
1152
|
-
|
|
1153
|
-
|
|
1154
|
-
|
|
1155
|
-
|
|
1156
|
-
type: "button",
|
|
1157
|
-
class: normalizeClass(["group/sort -mx-1 inline-flex items-center gap-1 rounded-small px-1 outline-none transition-colors duration-[var(--duration-fast)] hover:text-ink focus-visible:ring-2 focus-visible:ring-ring", [
|
|
1158
|
-
col.align === "right" ? "flex-row-reverse" : "",
|
|
1159
|
-
sortOf(col) ? "text-ink" : ""
|
|
1160
|
-
]]),
|
|
1161
|
-
onClick: ($event) => toggleSort(col, $event)
|
|
1162
|
-
}, [
|
|
1163
|
-
createTextVNode(toDisplayString(col.label) + " ", 1),
|
|
1164
|
-
col.sortable ? (openBlock(), createBlock(_sfc_main$6, {
|
|
1165
|
-
key: 0,
|
|
1166
|
-
name: sortIcon(col),
|
|
1167
|
-
size: 13,
|
|
1168
|
-
class: normalizeClass([
|
|
1169
|
-
"shrink-0 transition-[transform,opacity] duration-[var(--duration-fast)] ease-[var(--ease-emphasized)]",
|
|
1170
|
-
sortOf(col) ? "opacity-100" : "opacity-40 group-hover/sort:opacity-70"
|
|
1171
|
-
])
|
|
1172
|
-
}, null, 8, ["name", "class"])) : createCommentVNode("", true),
|
|
1173
|
-
sortPosition(col) ? (openBlock(), createElementBlock("span", _hoisted_15, toDisplayString(sortPosition(col)), 1)) : createCommentVNode("", true)
|
|
1174
|
-
], 10, _hoisted_14)
|
|
1175
|
-
]),
|
|
1176
|
-
_: 2
|
|
1177
|
-
}, 1032, ["items"])) : (openBlock(), createElementBlock(Fragment, { key: 1 }, [
|
|
1178
|
-
createTextVNode(toDisplayString(col.label), 1)
|
|
1179
|
-
], 64)),
|
|
1180
|
-
col.filterable ? (openBlock(), createBlock(_sfc_main$a, {
|
|
1181
|
-
key: 2,
|
|
1182
|
-
align: "start",
|
|
1183
|
-
"panel-class": "w-72",
|
|
1184
|
-
"aria-label": text.value.filterColumn.replace("{column}", col.label)
|
|
1185
|
-
}, {
|
|
1186
|
-
trigger: withCtx(() => [
|
|
1187
|
-
createElementVNode("button", {
|
|
1188
|
-
type: "button",
|
|
1189
|
-
class: normalizeClass(["ml-0.5 inline-grid size-5 place-items-center rounded-small align-middle outline-none transition-colors duration-fast hover:bg-surface-raised hover:text-ink focus-visible:ring-2 focus-visible:ring-ring", hiddenValues.value[col.key]?.size ? "text-brand" : "opacity-60"]),
|
|
1190
|
-
"aria-label": text.value.filterColumn.replace("{column}", col.label),
|
|
1191
|
-
"data-lp-filter": col.key
|
|
1192
|
-
}, [
|
|
1193
|
-
createVNode(_sfc_main$6, {
|
|
1194
|
-
name: hiddenValues.value[col.key]?.size ? "lucide:filter-x" : "lucide:filter",
|
|
1195
|
-
size: 12
|
|
1196
|
-
}, null, 8, ["name"])
|
|
1197
|
-
], 10, _hoisted_16)
|
|
1198
|
-
]),
|
|
1199
|
-
default: withCtx(() => [
|
|
1200
|
-
createVNode(_sfc_main$b, {
|
|
1201
|
-
options: facetOptions.value.get(col.key)?.value ?? [],
|
|
1202
|
-
hidden: hiddenValues.value[col.key] ?? /* @__PURE__ */ new Set(),
|
|
1203
|
-
labels: filterLabels(),
|
|
1204
|
-
"onUpdate:hidden": (next) => setHidden(col.key, next)
|
|
1205
|
-
}, null, 8, ["options", "hidden", "labels", "onUpdate:hidden"])
|
|
1206
|
-
]),
|
|
1207
|
-
_: 2
|
|
1208
|
-
}, 1032, ["aria-label"])) : createCommentVNode("", true),
|
|
1209
|
-
canResize(col) ? (openBlock(), createElementBlock("span", {
|
|
1210
|
-
key: 3,
|
|
1211
|
-
role: "separator",
|
|
1212
|
-
"aria-orientation": "vertical",
|
|
1213
|
-
tabindex: "0",
|
|
1214
|
-
"aria-label": text.value.resizeColumn.replace("{column}", col.label),
|
|
1215
|
-
"aria-valuenow": widths.value[col.key],
|
|
1216
|
-
class: "absolute inset-y-0 right-0 w-1.5 cursor-col-resize touch-none outline-none transition-colors duration-fast hover:bg-brand focus-visible:bg-brand",
|
|
1217
|
-
"data-lp-resize": col.key,
|
|
1218
|
-
onPointerdown: ($event) => startResize($event, col),
|
|
1219
|
-
onClick: _cache[2] || (_cache[2] = withModifiers(() => {
|
|
1220
|
-
}, ["stop"])),
|
|
1221
|
-
onDblclick: withModifiers(($event) => clearWidth(col), ["stop"]),
|
|
1222
|
-
onKeydown: ($event) => onResizeKey($event, col)
|
|
1223
|
-
}, null, 40, _hoisted_17)) : createCommentVNode("", true)
|
|
1224
|
-
], 14, _hoisted_13);
|
|
1225
|
-
}), 128))
|
|
1226
|
-
])
|
|
1227
|
-
], 2),
|
|
1228
|
-
createVNode(TransitionGroup, {
|
|
1229
|
-
tag: "tbody",
|
|
1230
|
-
name: "lp-row",
|
|
1231
|
-
css: animating.value && !__props.virtualRowHeight,
|
|
1232
|
-
class: normalizeClass(busy.value && displayRows.value.length ? "opacity-60 transition-opacity" : "transition-opacity"),
|
|
1233
|
-
"aria-busy": busy.value || void 0,
|
|
1234
|
-
ref: (el) => unref(roving).setContainer(el?.$el ?? null)
|
|
1235
|
-
}, {
|
|
1236
|
-
default: withCtx(() => [
|
|
1237
|
-
displayRows.value.length === 0 && busy.value ? (openBlock(true), createElementBlock(Fragment, { key: 0 }, renderList(__props.skeletonRows, (n) => {
|
|
1238
|
-
return openBlock(), createElementBlock("tr", {
|
|
1239
|
-
key: `lp-table-skeleton-${n}`,
|
|
1240
|
-
class: "lp-row-empty border-b border-line/60 last:border-0"
|
|
1241
|
-
}, [
|
|
1242
|
-
expansionOn.value ? (openBlock(), createElementBlock("td", {
|
|
1243
|
-
key: 0,
|
|
1244
|
-
class: normalizeClass(["w-px p-0", cellY.value])
|
|
1245
|
-
}, null, 2)) : createCommentVNode("", true),
|
|
1246
|
-
__props.selectable ? (openBlock(), createElementBlock("td", {
|
|
1128
|
+
class: normalizeClass(["w-px p-0", cellY.value]),
|
|
1129
|
+
style: normalizeStyle(fixedLayout.value ? { width: EXPAND_COLUMN_WIDTH } : void 0)
|
|
1130
|
+
}, null, 6)) : createCommentVNode("", true),
|
|
1131
|
+
__props.selectable ? (openBlock(), createElementBlock("th", {
|
|
1247
1132
|
key: 1,
|
|
1248
|
-
class: normalizeClass(["w-px p-0", cellY.value])
|
|
1249
|
-
|
|
1250
|
-
|
|
1251
|
-
|
|
1133
|
+
class: normalizeClass(["w-px p-0", cellY.value]),
|
|
1134
|
+
style: normalizeStyle(fixedLayout.value ? { width: ticksShown.value ? TICK_COLUMN_WIDTH : "0" } : void 0)
|
|
1135
|
+
}, [
|
|
1136
|
+
createElementVNode("div", {
|
|
1137
|
+
class: normalizeClass(["lp-tick lp-tick-open", ticksShown.value ? "" : "lp-tick-hidden"]),
|
|
1138
|
+
inert: !ticksShown.value
|
|
1139
|
+
}, [
|
|
1140
|
+
createVNode(_sfc_main$9, {
|
|
1141
|
+
"model-value": allChecked.value,
|
|
1142
|
+
indeterminate: someChecked.value,
|
|
1143
|
+
"onUpdate:modelValue": toggleAll
|
|
1144
|
+
}, null, 8, ["model-value", "indeterminate"])
|
|
1145
|
+
], 10, _hoisted_12)
|
|
1146
|
+
], 6)) : createCommentVNode("", true),
|
|
1147
|
+
(openBlock(true), createElementBlock(Fragment, null, renderList(shownColumns.value, (col) => {
|
|
1148
|
+
return openBlock(), createElementBlock("th", {
|
|
1252
1149
|
key: col.key,
|
|
1253
|
-
|
|
1150
|
+
style: normalizeStyle(headStyle(col)),
|
|
1151
|
+
class: normalizeClass(["px-4 text-[11px] font-semibold uppercase tracking-[0.08em] text-muted", [alignClass(col.align), cellY.value, col.pin ? PIN_HEAD : "", canResize(col) && !col.pin ? "relative" : ""]]),
|
|
1152
|
+
"data-lp-col": measuredCol(col),
|
|
1153
|
+
"aria-sort": sortOf(col) ? sortOf(col).dir === "asc" ? "ascending" : "descending" : void 0
|
|
1254
1154
|
}, [
|
|
1255
|
-
|
|
1256
|
-
class: "inline-block h-3 align-middle",
|
|
1257
|
-
style: normalizeStyle({ width: skeletonWidth(n, ci) })
|
|
1258
|
-
}, null, 8, ["style"]),
|
|
1259
|
-
n === 1 && ci === 0 ? (openBlock(), createElementBlock("span", _hoisted_18, toDisplayString(text.value.loading), 1)) : createCommentVNode("", true)
|
|
1260
|
-
], 2);
|
|
1261
|
-
}), 128))
|
|
1262
|
-
]);
|
|
1263
|
-
}), 128)) : displayRows.value.length === 0 ? (openBlock(), createElementBlock("tr", _hoisted_19, [
|
|
1264
|
-
createElementVNode("td", {
|
|
1265
|
-
colspan: colSpan.value,
|
|
1266
|
-
class: "p-0"
|
|
1267
|
-
}, [
|
|
1268
|
-
createVNode(_sfc_main$d, {
|
|
1269
|
-
compact: "",
|
|
1270
|
-
icon: failed.value ? "lucide:circle-alert" : filteredOut.value ? "lucide:filter-x" : __props.emptyIcon,
|
|
1271
|
-
title: failed.value ? text.value.error : filteredOut.value ? text.value.noMatches : text.value.empty
|
|
1272
|
-
}, {
|
|
1273
|
-
default: withCtx(() => [
|
|
1274
|
-
filteredOut.value ? (openBlock(), createBlock(_sfc_main$5, {
|
|
1155
|
+
col.sortable || col.filterable ? (openBlock(), createBlock(_sfc_main$8, {
|
|
1275
1156
|
key: 0,
|
|
1276
|
-
|
|
1277
|
-
size: "sm",
|
|
1278
|
-
onClick: resetFilters
|
|
1157
|
+
items: headerMenu(col)
|
|
1279
1158
|
}, {
|
|
1280
1159
|
default: withCtx(() => [
|
|
1281
|
-
|
|
1160
|
+
createElementVNode("button", {
|
|
1161
|
+
type: "button",
|
|
1162
|
+
class: normalizeClass(["group/sort -mx-1 inline-flex items-center gap-1 rounded-small px-1 outline-none transition-colors duration-[var(--duration-fast)] hover:text-ink focus-visible:ring-2 focus-visible:ring-ring", [
|
|
1163
|
+
col.align === "right" ? "flex-row-reverse" : "",
|
|
1164
|
+
sortOf(col) ? "text-ink" : ""
|
|
1165
|
+
]]),
|
|
1166
|
+
onClick: ($event) => toggleSort(col, $event)
|
|
1167
|
+
}, [
|
|
1168
|
+
createTextVNode(toDisplayString(col.label) + " ", 1),
|
|
1169
|
+
col.sortable ? (openBlock(), createBlock(_sfc_main$6, {
|
|
1170
|
+
key: 0,
|
|
1171
|
+
name: sortIcon(col),
|
|
1172
|
+
size: 13,
|
|
1173
|
+
class: normalizeClass([
|
|
1174
|
+
"shrink-0 transition-[transform,opacity] duration-[var(--duration-fast)] ease-[var(--ease-emphasized)]",
|
|
1175
|
+
sortOf(col) ? "opacity-100" : "opacity-40 group-hover/sort:opacity-70"
|
|
1176
|
+
])
|
|
1177
|
+
}, null, 8, ["name", "class"])) : createCommentVNode("", true),
|
|
1178
|
+
sortPosition(col) ? (openBlock(), createElementBlock("span", _hoisted_15, toDisplayString(sortPosition(col)), 1)) : createCommentVNode("", true)
|
|
1179
|
+
], 10, _hoisted_14)
|
|
1282
1180
|
]),
|
|
1283
|
-
_:
|
|
1284
|
-
})) :
|
|
1285
|
-
|
|
1286
|
-
|
|
1287
|
-
|
|
1288
|
-
|
|
1289
|
-
|
|
1290
|
-
|
|
1291
|
-
|
|
1292
|
-
|
|
1293
|
-
|
|
1294
|
-
|
|
1295
|
-
|
|
1296
|
-
|
|
1297
|
-
|
|
1298
|
-
|
|
1299
|
-
|
|
1300
|
-
|
|
1301
|
-
|
|
1302
|
-
|
|
1303
|
-
|
|
1304
|
-
|
|
1305
|
-
|
|
1306
|
-
|
|
1307
|
-
|
|
1308
|
-
|
|
1181
|
+
_: 2
|
|
1182
|
+
}, 1032, ["items"])) : (openBlock(), createElementBlock(Fragment, { key: 1 }, [
|
|
1183
|
+
createTextVNode(toDisplayString(col.label), 1)
|
|
1184
|
+
], 64)),
|
|
1185
|
+
col.filterable ? (openBlock(), createBlock(_sfc_main$a, {
|
|
1186
|
+
key: 2,
|
|
1187
|
+
align: "start",
|
|
1188
|
+
"panel-class": "w-72",
|
|
1189
|
+
"aria-label": text.value.filterColumn.replace("{column}", col.label)
|
|
1190
|
+
}, {
|
|
1191
|
+
trigger: withCtx(() => [
|
|
1192
|
+
createElementVNode("button", {
|
|
1193
|
+
type: "button",
|
|
1194
|
+
class: normalizeClass(["ml-0.5 inline-grid size-5 place-items-center rounded-small align-middle outline-none transition-colors duration-fast hover:bg-surface-raised hover:text-ink focus-visible:ring-2 focus-visible:ring-ring", hiddenValues.value[col.key]?.size ? "text-brand" : "opacity-60"]),
|
|
1195
|
+
"aria-label": text.value.filterColumn.replace("{column}", col.label),
|
|
1196
|
+
"data-lp-filter": col.key
|
|
1197
|
+
}, [
|
|
1198
|
+
createVNode(_sfc_main$6, {
|
|
1199
|
+
name: hiddenValues.value[col.key]?.size ? "lucide:filter-x" : "lucide:filter",
|
|
1200
|
+
size: 12
|
|
1201
|
+
}, null, 8, ["name"])
|
|
1202
|
+
], 10, _hoisted_16)
|
|
1203
|
+
]),
|
|
1204
|
+
default: withCtx(() => [
|
|
1205
|
+
createVNode(_sfc_main$b, {
|
|
1206
|
+
options: facetOptions.value.get(col.key)?.value ?? [],
|
|
1207
|
+
hidden: hiddenValues.value[col.key] ?? /* @__PURE__ */ new Set(),
|
|
1208
|
+
labels: filterLabels(),
|
|
1209
|
+
"onUpdate:hidden": (next) => setHidden(col.key, next)
|
|
1210
|
+
}, null, 8, ["options", "hidden", "labels", "onUpdate:hidden"])
|
|
1211
|
+
]),
|
|
1212
|
+
_: 2
|
|
1213
|
+
}, 1032, ["aria-label"])) : createCommentVNode("", true),
|
|
1214
|
+
canResize(col) ? (openBlock(), createElementBlock("span", {
|
|
1215
|
+
key: 3,
|
|
1216
|
+
role: "separator",
|
|
1217
|
+
"aria-orientation": "vertical",
|
|
1218
|
+
tabindex: "0",
|
|
1219
|
+
"aria-label": text.value.resizeColumn.replace("{column}", col.label),
|
|
1220
|
+
"aria-valuenow": widths.value[col.key],
|
|
1221
|
+
class: "absolute inset-y-0 right-0 w-1.5 cursor-col-resize touch-none outline-none transition-colors duration-fast hover:bg-brand focus-visible:bg-brand",
|
|
1222
|
+
"data-lp-resize": col.key,
|
|
1223
|
+
onPointerdown: ($event) => startResize($event, col),
|
|
1224
|
+
onClick: _cache[2] || (_cache[2] = withModifiers(() => {
|
|
1225
|
+
}, ["stop"])),
|
|
1226
|
+
onDblclick: withModifiers(($event) => clearWidth(col), ["stop"]),
|
|
1227
|
+
onKeydown: ($event) => onResizeKey($event, col)
|
|
1228
|
+
}, null, 40, _hoisted_17)) : createCommentVNode("", true)
|
|
1229
|
+
], 14, _hoisted_13);
|
|
1230
|
+
}), 128))
|
|
1231
|
+
])
|
|
1232
|
+
], 2),
|
|
1233
|
+
createVNode(TransitionGroup, {
|
|
1234
|
+
tag: "tbody",
|
|
1235
|
+
name: "lp-row",
|
|
1236
|
+
css: animating.value && !__props.virtualRowHeight,
|
|
1237
|
+
class: normalizeClass(busy.value && displayRows.value.length ? "opacity-60 transition-opacity" : "transition-opacity"),
|
|
1238
|
+
"aria-busy": busy.value || void 0,
|
|
1239
|
+
ref: (el) => unref(roving).setContainer(el?.$el ?? null)
|
|
1240
|
+
}, {
|
|
1241
|
+
default: withCtx(() => [
|
|
1242
|
+
displayRows.value.length === 0 && busy.value ? (openBlock(true), createElementBlock(Fragment, { key: 0 }, renderList(__props.skeletonRows, (n) => {
|
|
1243
|
+
return openBlock(), createElementBlock("tr", {
|
|
1244
|
+
key: `lp-table-skeleton-${n}`,
|
|
1245
|
+
class: "lp-row-empty border-b border-line/60 last:border-0"
|
|
1309
1246
|
}, [
|
|
1310
|
-
|
|
1311
|
-
|
|
1312
|
-
|
|
1313
|
-
|
|
1314
|
-
|
|
1315
|
-
|
|
1316
|
-
|
|
1317
|
-
|
|
1318
|
-
|
|
1319
|
-
|
|
1320
|
-
|
|
1321
|
-
"
|
|
1322
|
-
onClick: ($event) => toggleGroup(entry.group)
|
|
1247
|
+
expansionOn.value ? (openBlock(), createElementBlock("td", {
|
|
1248
|
+
key: 0,
|
|
1249
|
+
class: normalizeClass(["w-px p-0", cellY.value])
|
|
1250
|
+
}, null, 2)) : createCommentVNode("", true),
|
|
1251
|
+
__props.selectable ? (openBlock(), createElementBlock("td", {
|
|
1252
|
+
key: 1,
|
|
1253
|
+
class: normalizeClass(["w-px p-0", cellY.value])
|
|
1254
|
+
}, null, 2)) : createCommentVNode("", true),
|
|
1255
|
+
(openBlock(true), createElementBlock(Fragment, null, renderList(shownColumns.value, (col, ci) => {
|
|
1256
|
+
return openBlock(), createElementBlock("td", {
|
|
1257
|
+
key: col.key,
|
|
1258
|
+
class: normalizeClass(["px-4", [alignClass(col.align), cellY.value]])
|
|
1323
1259
|
}, [
|
|
1324
|
-
createVNode(_sfc_main$
|
|
1325
|
-
|
|
1326
|
-
|
|
1327
|
-
|
|
1328
|
-
|
|
1329
|
-
|
|
1330
|
-
|
|
1331
|
-
|
|
1332
|
-
|
|
1333
|
-
], 4)) : entry.kind === "detail" ? (openBlock(), createElementBlock("tr", _hoisted_25, [
|
|
1260
|
+
createVNode(_sfc_main$c, {
|
|
1261
|
+
class: "inline-block h-3 align-middle",
|
|
1262
|
+
style: normalizeStyle({ width: skeletonWidth(n, ci) })
|
|
1263
|
+
}, null, 8, ["style"]),
|
|
1264
|
+
n === 1 && ci === 0 ? (openBlock(), createElementBlock("span", _hoisted_18, toDisplayString(text.value.loading), 1)) : createCommentVNode("", true)
|
|
1265
|
+
], 2);
|
|
1266
|
+
}), 128))
|
|
1267
|
+
]);
|
|
1268
|
+
}), 128)) : displayRows.value.length === 0 ? (openBlock(), createElementBlock("tr", _hoisted_19, [
|
|
1334
1269
|
createElementVNode("td", {
|
|
1335
1270
|
colspan: colSpan.value,
|
|
1336
|
-
class: "
|
|
1271
|
+
class: "p-0"
|
|
1337
1272
|
}, [
|
|
1338
|
-
|
|
1339
|
-
|
|
1340
|
-
|
|
1341
|
-
|
|
1342
|
-
|
|
1343
|
-
|
|
1344
|
-
|
|
1345
|
-
|
|
1346
|
-
|
|
1347
|
-
|
|
1348
|
-
|
|
1349
|
-
|
|
1350
|
-
|
|
1351
|
-
|
|
1352
|
-
|
|
1353
|
-
|
|
1354
|
-
|
|
1355
|
-
|
|
1356
|
-
|
|
1357
|
-
|
|
1358
|
-
|
|
1359
|
-
|
|
1360
|
-
|
|
1361
|
-
|
|
1362
|
-
|
|
1273
|
+
createVNode(_sfc_main$d, {
|
|
1274
|
+
compact: "",
|
|
1275
|
+
icon: failed.value ? "lucide:circle-alert" : filteredOut.value ? "lucide:filter-x" : __props.emptyIcon,
|
|
1276
|
+
title: failed.value ? text.value.error : filteredOut.value ? text.value.noMatches : text.value.empty
|
|
1277
|
+
}, {
|
|
1278
|
+
default: withCtx(() => [
|
|
1279
|
+
filteredOut.value ? (openBlock(), createBlock(_sfc_main$5, {
|
|
1280
|
+
key: 0,
|
|
1281
|
+
variant: "outline",
|
|
1282
|
+
size: "sm",
|
|
1283
|
+
onClick: resetFilters
|
|
1284
|
+
}, {
|
|
1285
|
+
default: withCtx(() => [
|
|
1286
|
+
createTextVNode(toDisplayString(text.value.resetFilters), 1)
|
|
1287
|
+
]),
|
|
1288
|
+
_: 1
|
|
1289
|
+
})) : createCommentVNode("", true)
|
|
1290
|
+
]),
|
|
1291
|
+
_: 1
|
|
1292
|
+
}, 8, ["icon", "title"])
|
|
1293
|
+
], 8, _hoisted_20)
|
|
1294
|
+
])) : createCommentVNode("", true),
|
|
1295
|
+
rowWindowed.value?.before ? (openBlock(), createElementBlock("tr", _hoisted_21, [
|
|
1296
|
+
createElementVNode("td", {
|
|
1297
|
+
colspan: colSpan.value,
|
|
1298
|
+
class: "p-0",
|
|
1299
|
+
style: normalizeStyle({ height: `${rowWindowed.value.before}px` })
|
|
1300
|
+
}, null, 12, _hoisted_22)
|
|
1301
|
+
])) : createCommentVNode("", true),
|
|
1302
|
+
(openBlock(true), createElementBlock(Fragment, null, renderList(viewEntries.value, (entry) => {
|
|
1303
|
+
return openBlock(), createElementBlock(Fragment, {
|
|
1304
|
+
key: entry.id
|
|
1363
1305
|
}, [
|
|
1364
|
-
|
|
1306
|
+
entry.kind === "group" ? (openBlock(), createElementBlock("tr", {
|
|
1365
1307
|
key: 0,
|
|
1366
|
-
|
|
1367
|
-
|
|
1368
|
-
"aria-expanded": expandedKeys.value.has(keyFor(entry.row, entry.index)),
|
|
1369
|
-
"aria-label": expandedKeys.value.has(keyFor(entry.row, entry.index)) ? text.value.collapseRow : text.value.expandRow,
|
|
1370
|
-
onClick: ($event) => toggleExpanded(keyFor(entry.row, entry.index))
|
|
1308
|
+
class: "border-b border-line/60 bg-surface-soft/60",
|
|
1309
|
+
style: normalizeStyle(rowStyle.value)
|
|
1371
1310
|
}, [
|
|
1372
|
-
|
|
1373
|
-
|
|
1374
|
-
|
|
1375
|
-
|
|
1376
|
-
|
|
1377
|
-
|
|
1378
|
-
|
|
1379
|
-
|
|
1380
|
-
|
|
1381
|
-
|
|
1382
|
-
|
|
1383
|
-
|
|
1384
|
-
|
|
1385
|
-
|
|
1386
|
-
|
|
1387
|
-
|
|
1388
|
-
|
|
1389
|
-
|
|
1390
|
-
|
|
1391
|
-
|
|
1392
|
-
|
|
1393
|
-
|
|
1394
|
-
|
|
1395
|
-
|
|
1396
|
-
|
|
1397
|
-
|
|
1398
|
-
|
|
1399
|
-
|
|
1400
|
-
|
|
1401
|
-
|
|
1402
|
-
|
|
1403
|
-
|
|
1404
|
-
|
|
1405
|
-
|
|
1406
|
-
|
|
1311
|
+
createElementVNode("td", {
|
|
1312
|
+
colspan: colSpan.value,
|
|
1313
|
+
class: normalizeClass(["px-4 text-xs font-medium text-muted", cellY.value])
|
|
1314
|
+
}, [
|
|
1315
|
+
renderSlot(_ctx.$slots, "group", {
|
|
1316
|
+
value: entry.value,
|
|
1317
|
+
rows: entry.rows,
|
|
1318
|
+
label: entry.label,
|
|
1319
|
+
collapsed: entry.collapsed,
|
|
1320
|
+
toggle: () => toggleGroup(entry.group)
|
|
1321
|
+
}, () => [
|
|
1322
|
+
createElementVNode("button", {
|
|
1323
|
+
type: "button",
|
|
1324
|
+
class: "inline-flex items-center gap-1 rounded-small outline-none transition-colors duration-fast hover:text-ink focus-visible:ring-2 focus-visible:ring-ring",
|
|
1325
|
+
"aria-expanded": !entry.collapsed,
|
|
1326
|
+
"aria-label": (entry.collapsed ? text.value.expandGroup : text.value.collapseGroup).replace("{label}", entry.label),
|
|
1327
|
+
onClick: ($event) => toggleGroup(entry.group)
|
|
1328
|
+
}, [
|
|
1329
|
+
createVNode(_sfc_main$6, {
|
|
1330
|
+
name: "lucide:chevron-right",
|
|
1331
|
+
size: 14,
|
|
1332
|
+
class: normalizeClass(["transition-transform duration-fast motion-reduce:transition-none", entry.collapsed ? "" : "rotate-90"])
|
|
1333
|
+
}, null, 8, ["class"]),
|
|
1334
|
+
createTextVNode(" " + toDisplayString(entry.label), 1)
|
|
1335
|
+
], 8, _hoisted_24)
|
|
1336
|
+
], true)
|
|
1337
|
+
], 10, _hoisted_23)
|
|
1338
|
+
], 4)) : entry.kind === "detail" ? (openBlock(), createElementBlock("tr", _hoisted_25, [
|
|
1339
|
+
createElementVNode("td", {
|
|
1340
|
+
colspan: colSpan.value,
|
|
1341
|
+
class: "px-4 py-3"
|
|
1342
|
+
}, [
|
|
1343
|
+
renderSlot(_ctx.$slots, "expanded", {
|
|
1344
|
+
row: entry.row,
|
|
1345
|
+
close: () => toggleExpanded(keyFor(entry.row, entry.index))
|
|
1346
|
+
}, void 0, true)
|
|
1347
|
+
], 8, _hoisted_26)
|
|
1348
|
+
])) : (openBlock(), createElementBlock("tr", mergeProps({
|
|
1349
|
+
key: 2,
|
|
1350
|
+
onContextmenu: ($event) => onRowContextMenu(entry.row),
|
|
1351
|
+
class: ["group border-b border-line/60 outline-none transition-colors last:border-0 hover:bg-surface-soft/60 focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-ring data-[active]:bg-surface-soft/40", isSelected(keyFor(entry.row, entry.index)) ? "bg-brand-soft/40" : ""],
|
|
1352
|
+
style: rowStyle.value,
|
|
1353
|
+
"aria-rowindex": __props.virtualRowHeight ? rowOffset(entry) : void 0
|
|
1354
|
+
}, { ref_for: true }, unref(roving).itemProps(String(keyFor(entry.row, entry.index))), {
|
|
1355
|
+
"data-paint-key": __props.selectable ? String(keyFor(entry.row, entry.index)) : void 0,
|
|
1356
|
+
"data-lp-context-row": __props.rowMenu ? "" : void 0,
|
|
1357
|
+
onClick: ($event) => onRowClick(entry.row, keyFor(entry.row, entry.index)),
|
|
1358
|
+
onPointerdown: ($event) => onRowPointerDown($event, keyFor(entry.row, entry.index)),
|
|
1359
|
+
onKeydown: onRowKeydown
|
|
1360
|
+
}), [
|
|
1361
|
+
expansionOn.value ? (openBlock(), createElementBlock("td", {
|
|
1362
|
+
key: 0,
|
|
1363
|
+
class: normalizeClass(["w-px p-0 text-center", cellY.value]),
|
|
1364
|
+
onClick: _cache[3] || (_cache[3] = withModifiers(() => {
|
|
1365
|
+
}, ["stop"])),
|
|
1366
|
+
onKeydown: _cache[4] || (_cache[4] = withModifiers(() => {
|
|
1367
|
+
}, ["stop"]))
|
|
1368
|
+
}, [
|
|
1369
|
+
canExpand(entry.row) ? (openBlock(), createElementBlock("button", {
|
|
1407
1370
|
key: 0,
|
|
1408
|
-
|
|
1409
|
-
|
|
1410
|
-
|
|
1411
|
-
|
|
1412
|
-
|
|
1413
|
-
onKeydown: _cache[8] || (_cache[8] = withModifiers(() => {
|
|
1414
|
-
}, ["stop"]))
|
|
1371
|
+
type: "button",
|
|
1372
|
+
class: "inline-grid size-6 place-items-center rounded-small text-muted outline-none transition-colors duration-fast hover:text-ink focus-visible:ring-2 focus-visible:ring-ring",
|
|
1373
|
+
"aria-expanded": expandedKeys.value.has(keyFor(entry.row, entry.index)),
|
|
1374
|
+
"aria-label": expandedKeys.value.has(keyFor(entry.row, entry.index)) ? text.value.collapseRow : text.value.expandRow,
|
|
1375
|
+
onClick: ($event) => toggleExpanded(keyFor(entry.row, entry.index))
|
|
1415
1376
|
}, [
|
|
1416
|
-
createVNode(_sfc_main$
|
|
1417
|
-
|
|
1418
|
-
|
|
1419
|
-
|
|
1420
|
-
|
|
1421
|
-
|
|
1422
|
-
|
|
1423
|
-
|
|
1424
|
-
|
|
1425
|
-
|
|
1426
|
-
|
|
1427
|
-
|
|
1428
|
-
|
|
1429
|
-
|
|
1430
|
-
|
|
1431
|
-
|
|
1432
|
-
|
|
1433
|
-
|
|
1434
|
-
|
|
1435
|
-
|
|
1436
|
-
|
|
1437
|
-
|
|
1438
|
-
|
|
1439
|
-
|
|
1440
|
-
|
|
1441
|
-
|
|
1442
|
-
|
|
1377
|
+
createVNode(_sfc_main$6, {
|
|
1378
|
+
name: "lucide:chevron-right",
|
|
1379
|
+
size: 14,
|
|
1380
|
+
class: normalizeClass(["transition-transform duration-fast motion-reduce:transition-none", expandedKeys.value.has(keyFor(entry.row, entry.index)) ? "rotate-90" : ""])
|
|
1381
|
+
}, null, 8, ["class"])
|
|
1382
|
+
], 8, _hoisted_28)) : createCommentVNode("", true)
|
|
1383
|
+
], 34)) : createCommentVNode("", true),
|
|
1384
|
+
__props.selectable ? (openBlock(), createElementBlock("td", {
|
|
1385
|
+
key: 1,
|
|
1386
|
+
class: normalizeClass(["w-px cursor-pointer p-0 select-none", cellY.value]),
|
|
1387
|
+
onClick: _cache[5] || (_cache[5] = withModifiers(() => {
|
|
1388
|
+
}, ["stop"])),
|
|
1389
|
+
onPointerdown: withModifiers(($event) => unref(paint).onPointerDown($event, keyFor(entry.row, entry.index)), ["stop"])
|
|
1390
|
+
}, [
|
|
1391
|
+
createElementVNode("div", {
|
|
1392
|
+
class: normalizeClass(["lp-tick lp-tick-open", ticksShown.value ? "" : "lp-tick-cue"])
|
|
1393
|
+
}, [
|
|
1394
|
+
createVNode(_sfc_main$9, {
|
|
1395
|
+
"model-value": isSelected(keyFor(entry.row, entry.index)),
|
|
1396
|
+
"onUpdate:modelValue": (v) => toggleRow(keyFor(entry.row, entry.index), v)
|
|
1397
|
+
}, null, 8, ["model-value", "onUpdate:modelValue"])
|
|
1398
|
+
], 2)
|
|
1399
|
+
], 42, _hoisted_29)) : createCommentVNode("", true),
|
|
1400
|
+
(openBlock(true), createElementBlock(Fragment, null, renderList(shownColumns.value, (col) => {
|
|
1401
|
+
return openBlock(), createElementBlock("td", {
|
|
1402
|
+
key: col.key,
|
|
1403
|
+
class: normalizeClass(["px-4 text-ink", [alignClass(col.align), cellY.value, col.nowrap ? "whitespace-nowrap" : "", col.pin ? PIN_CELL : ""]]),
|
|
1404
|
+
style: normalizeStyle(pinStyle(col))
|
|
1405
|
+
}, [
|
|
1406
|
+
renderSlot(_ctx.$slots, `cell-${col.key}`, {
|
|
1407
|
+
row: entry.row,
|
|
1408
|
+
value: entry.row[col.key],
|
|
1409
|
+
openMenu: openRowMenu
|
|
1410
|
+
}, () => [
|
|
1411
|
+
isEditable(col, entry.row) ? (openBlock(), createElementBlock("span", {
|
|
1412
|
+
key: 0,
|
|
1413
|
+
class: "inline-block",
|
|
1414
|
+
onClick: _cache[6] || (_cache[6] = withModifiers(() => {
|
|
1415
|
+
}, ["stop"])),
|
|
1416
|
+
onPointerdown: _cache[7] || (_cache[7] = withModifiers(() => {
|
|
1417
|
+
}, ["stop"])),
|
|
1418
|
+
onKeydown: _cache[8] || (_cache[8] = withModifiers(() => {
|
|
1419
|
+
}, ["stop"]))
|
|
1420
|
+
}, [
|
|
1421
|
+
createVNode(_sfc_main$e, {
|
|
1422
|
+
"model-value": String(entry.row[col.key] ?? ""),
|
|
1423
|
+
label: col.label,
|
|
1424
|
+
size: "sm",
|
|
1425
|
+
validate: (value) => col.validateEdit?.(value, entry.row),
|
|
1426
|
+
save: (value) => saveCell(col, entry.row, value)
|
|
1427
|
+
}, null, 8, ["model-value", "label", "validate", "save"])
|
|
1428
|
+
], 32)) : (openBlock(), createElementBlock(Fragment, { key: 1 }, [
|
|
1429
|
+
createTextVNode(toDisplayString(entry.row[col.key]), 1)
|
|
1430
|
+
], 64))
|
|
1431
|
+
], true)
|
|
1432
|
+
], 6);
|
|
1433
|
+
}), 128))
|
|
1434
|
+
], 16, _hoisted_27))
|
|
1435
|
+
], 64);
|
|
1436
|
+
}), 128)),
|
|
1437
|
+
rowWindowed.value?.after ? (openBlock(), createElementBlock("tr", _hoisted_30, [
|
|
1438
|
+
createElementVNode("td", {
|
|
1439
|
+
colspan: colSpan.value,
|
|
1440
|
+
class: "p-0",
|
|
1441
|
+
style: normalizeStyle({ height: `${rowWindowed.value.after}px` })
|
|
1442
|
+
}, null, 12, _hoisted_31)
|
|
1443
|
+
])) : createCommentVNode("", true)
|
|
1444
|
+
]),
|
|
1445
|
+
_: 3
|
|
1446
|
+
}, 8, ["css", "class", "aria-busy"])
|
|
1447
|
+
], 14, _hoisted_10)
|
|
1448
|
+
]),
|
|
1449
|
+
_: 3
|
|
1450
|
+
}, 8, ["items", "no-hint", "title", "subtitle", "title-icon", "title-image"])
|
|
1443
1451
|
]),
|
|
1444
1452
|
_: 3
|
|
1445
|
-
},
|
|
1453
|
+
}, 16, ["style", "bar-inset-top"])
|
|
1446
1454
|
]),
|
|
1447
1455
|
_: 3
|
|
1448
|
-
},
|
|
1456
|
+
}, 8, ["disabled"]),
|
|
1449
1457
|
__props.load && total.value > __props.pageSize ? (openBlock(), createBlock(_sfc_main$f, {
|
|
1450
1458
|
key: 0,
|
|
1451
1459
|
page: page.value,
|
|
@@ -1458,7 +1466,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
|
1458
1466
|
};
|
|
1459
1467
|
}
|
|
1460
1468
|
});
|
|
1461
|
-
const LpTable = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-
|
|
1469
|
+
const LpTable = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-3fb24315"]]);
|
|
1462
1470
|
export {
|
|
1463
1471
|
LpTable as default
|
|
1464
1472
|
};
|