@gxp-dev/mod-ui 2.0.12 → 2.0.14

package/dist/components/compositions/cards/CardListCard.vue_vue_type_script_setup_true_lang.js

@@ -1,109 +0,0 @@
-import e from "../../ui/card/Card.js";
-import t from "../../ui/card/CardContent.js";
-import n from "../../ui/card/CardDescription.js";
-import r from "../../ui/card/CardHeader.js";
-import i from "../../ui/card/CardTitle.js";
-import "../../ui/card/index.js";
-import a from "../../../engine/CardRenderer.js";
-import { Fragment as o, computed as s, createBlock as c, createCommentVNode as l, createElementBlock as u, createTextVNode as d, createVNode as f, defineComponent as p, normalizeClass as m, normalizeStyle as h, openBlock as g, ref as _, renderList as v, resolveDynamicComponent as y, toDisplayString as b, unref as x, withCtx as S } from "vue";
-//#region src/components/compositions/cards/CardListCard.vue?vue&type=script&setup=true&lang.ts
-var C = {
-	key: 1,
-	class: "mb-3 flex flex-col gap-0.5"
-}, w = {
-	key: 0,
-	class: "text-base font-semibold"
-}, T = {
-	key: 1,
-	class: "text-sm text-muted-foreground"
-}, E = {
-	key: 0,
-	class: "text-sm text-muted-foreground italic",
-	"data-testid": "card-list-empty"
-}, D = [
-	"draggable",
-	"data-card-list-item-id",
-	"onDragstart",
-	"onDrop"
-], O = /* @__PURE__ */ p({
-	__name: "CardListCard",
-	props: {
-		title: {},
-		subtitle: {},
-		showCard: {
-			type: Boolean,
-			default: !0
-		},
-		draggable: {
-			type: Boolean,
-			default: !1
-		},
-		dragTargetData: {},
-		gutterY: { default: "1rem" },
-		gutterX: { default: "1rem" },
-		cards: { default: () => [] },
-		item: { default: () => ({}) },
-		id: {}
-	},
-	emits: ["reorder"],
-	setup(p, { emit: O }) {
-		let k = p, A = O, j = _(null), M = s(() => j.value ?? k.cards), N = s(() => k.showCard !== !1), P = s(() => ({
-			rowGap: k.gutterY,
-			columnGap: k.gutterX
-		})), F = _(null);
-		function I(e, t) {
-			k.draggable && (F.value = t, e.dataTransfer && (e.dataTransfer.effectAllowed = "move", e.dataTransfer.setData("text/plain", k.dragTargetData ?? k.id ?? "")));
-		}
-		function L(e) {
-			k.draggable && (e.preventDefault(), e.dataTransfer && (e.dataTransfer.dropEffect = "move"));
-		}
-		function R(e, t) {
-			if (!k.draggable || F.value === null) return;
-			e.preventDefault();
-			let n = [...M.value], [r] = n.splice(F.value, 1);
-			n.splice(t, 0, r), j.value = n, F.value = null, A("reorder", n);
-		}
-		function z() {
-			F.value = null;
-		}
-		return (s, _) => (g(), c(y(N.value ? x(e) : "section"), { class: m(["gxp-card-list", N.value ? "" : "flex flex-col bg-transparent border-0 shadow-none"]) }, {
-			default: S(() => [N.value && (p.title || p.subtitle) ? (g(), c(x(r), { key: 0 }, {
-				default: S(() => [p.title ? (g(), c(x(i), { key: 0 }, {
-					default: S(() => [d(b(p.title), 1)]),
-					_: 1
-				})) : l("", !0), p.subtitle ? (g(), c(x(n), { key: 1 }, {
-					default: S(() => [d(b(p.subtitle), 1)]),
-					_: 1
-				})) : l("", !0)]),
-				_: 1
-			})) : p.title || p.subtitle ? (g(), u("header", C, [p.title ? (g(), u("h3", w, b(p.title), 1)) : l("", !0), p.subtitle ? (g(), u("p", T, b(p.subtitle), 1)) : l("", !0)])) : l("", !0), (g(), c(y(N.value ? x(t) : "div"), {
-				class: "flex flex-col",
-				style: h(P.value)
-			}, {
-				default: S(() => [M.value.length === 0 ? (g(), u("p", E, " No cards to display. ")) : (g(!0), u(o, { key: 1 }, v(M.value, (e, t) => (g(), u("div", {
-					key: e.id,
-					draggable: p.draggable === !0,
-					"data-card-list-item-id": e.id,
-					class: m([
-						"gxp-card-list__item",
-						p.draggable ? "cursor-move" : "",
-						F.value === t ? "opacity-50" : ""
-					]),
-					onDragstart: (e) => I(e, t),
-					onDragover: L,
-					onDrop: (e) => R(e, t),
-					onDragend: z
-				}, [f(a, {
-					card: e,
-					item: p.item
-				}, null, 8, ["card", "item"])], 42, D))), 128))]),
-				_: 1
-			}, 8, ["style"]))]),
-			_: 1
-		}, 8, ["class"]));
-	}
-});
-//#endregion
-export { O as default };
-
-//# sourceMappingURL=CardListCard.vue_vue_type_script_setup_true_lang.js.map

package/dist/components/compositions/cards/CardListCard.vue_vue_type_script_setup_true_lang.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"CardListCard.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../../src/components/compositions/cards/CardListCard.vue"],"sourcesContent":["<script setup lang=\"ts\">\n/**\n * Props-driven `card-list` composition — renders a list of nested\n * DisplayCards via `CardRenderer`. Each child card is a fully-resolved\n * DisplayCard (not an ID lookup).\n *\n * Self-contained — directly mountable in any Vue app:\n *\n *   <CardListCard\n *     title=\"Settings\"\n *     :cards=\"[generalCard, advancedCard]\"\n *     :item=\"dataModel\"\n *   />\n *\n * Drag-and-drop reordering is a lightweight HTML5 implementation when\n * `draggable === true`; on drop the new card order is emitted as\n * `reorder` so a parent (e.g. the FormBuilder) can persist it.\n */\nimport { computed, ref } from \"vue\"\nimport type { DisplayCard } from \"@/definitions/cards\"\nimport CardRenderer from \"@/engine/CardRenderer.vue\"\nimport {\n  Card,\n  CardContent,\n  CardHeader,\n  CardTitle,\n  CardDescription,\n} from \"@/components/ui/card\"\n\nexport interface CardListCardProps {\n  title?: string\n  subtitle?: string\n  showCard?: boolean\n  draggable?: boolean\n  dragTargetData?: string\n  gutterY?: string\n  gutterX?: string\n  /** Resolved child cards (NOT IDs). */\n  cards?: DisplayCard[]\n  /** Page-level data model passed through to child renderers. */\n  item?: Record<string, unknown>\n  /** Identifier used as a fallback drag payload when `dragTargetData` is unset. */\n  id?: string\n}\n\nconst props = withDefaults(defineProps<CardListCardProps>(), {\n  showCard: true,\n  draggable: false,\n  gutterY: \"1rem\",\n  gutterX: \"1rem\",\n  cards: () => [],\n  item: () => ({}),\n})\n\nconst emit = defineEmits<{\n  (e: \"reorder\", value: DisplayCard[]): void\n}>()\n\nconst internalOrder = ref<DisplayCard[] | null>(null)\n\nconst order = computed<DisplayCard[]>(\n  () => internalOrder.value ?? props.cards,\n)\n\nconst showChrome = computed<boolean>(() => props.showCard !== false)\n\nconst gridStyle = computed(() => ({\n  rowGap: props.gutterY,\n  columnGap: props.gutterX,\n}))\n\nconst dragIndex = ref<number | null>(null)\n\nfunction onDragStart(event: DragEvent, index: number): void {\n  if (!props.draggable) {\n    return\n  }\n  dragIndex.value = index\n  if (event.dataTransfer) {\n    event.dataTransfer.effectAllowed = \"move\"\n    event.dataTransfer.setData(\n      \"text/plain\",\n      props.dragTargetData ?? props.id ?? \"\",\n    )\n  }\n}\n\nfunction onDragOver(event: DragEvent): void {\n  if (!props.draggable) {\n    return\n  }\n  event.preventDefault()\n  if (event.dataTransfer) {\n    event.dataTransfer.dropEffect = \"move\"\n  }\n}\n\nfunction onDrop(event: DragEvent, targetIndex: number): void {\n  if (!props.draggable || dragIndex.value === null) {\n    return\n  }\n  event.preventDefault()\n  const next = [...order.value]\n  const [moved] = next.splice(dragIndex.value, 1)\n  next.splice(targetIndex, 0, moved)\n  internalOrder.value = next\n  dragIndex.value = null\n  emit(\"reorder\", next)\n}\n\nfunction onDragEnd(): void {\n  dragIndex.value = null\n}\n</script>\n\n<template>\n  <component\n    :is=\"showChrome ? Card : 'section'\"\n    :class=\"[\n      'gxp-card-list',\n      showChrome ? '' : 'flex flex-col bg-transparent border-0 shadow-none',\n    ]\"\n  >\n    <CardHeader v-if=\"showChrome && (title || subtitle)\">\n      <CardTitle v-if=\"title\">{{ title }}</CardTitle>\n      <CardDescription v-if=\"subtitle\">\n        {{ subtitle }}\n      </CardDescription>\n    </CardHeader>\n    <header\n      v-else-if=\"title || subtitle\"\n      class=\"mb-3 flex flex-col gap-0.5\"\n    >\n      <h3 v-if=\"title\" class=\"text-base font-semibold\">\n        {{ title }}\n      </h3>\n      <p v-if=\"subtitle\" class=\"text-sm text-muted-foreground\">\n        {{ subtitle }}\n      </p>\n    </header>\n\n    <component\n      :is=\"showChrome ? CardContent : 'div'\"\n      class=\"flex flex-col\"\n      :style=\"gridStyle\"\n    >\n      <template v-if=\"order.length === 0\">\n        <p\n          class=\"text-sm text-muted-foreground italic\"\n          data-testid=\"card-list-empty\"\n        >\n          No cards to display.\n        </p>\n      </template>\n      <template v-else>\n        <div\n          v-for=\"(child, index) in order\"\n          :key=\"child.id\"\n          :draggable=\"draggable === true\"\n          :data-card-list-item-id=\"child.id\"\n          :class=\"[\n            'gxp-card-list__item',\n            draggable ? 'cursor-move' : '',\n            dragIndex === index ? 'opacity-50' : '',\n          ]\"\n          @dragstart=\"onDragStart($event, index)\"\n          @dragover=\"onDragOver\"\n          @drop=\"onDrop($event, index)\"\n          @dragend=\"onDragEnd\"\n        >\n          <CardRenderer :card=\"child\" :item=\"item\" />\n        </div>\n      </template>\n    </component>\n  </component>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EA6CA,IAAM,IAAQ,GASR,IAAO,GAIP,IAAgB,EAA0B,IAAI,GAE9C,IAAQ,QACN,EAAc,SAAS,EAAM,KACrC,GAEM,IAAa,QAAwB,EAAM,aAAa,EAAK,GAE7D,IAAY,SAAgB;GAChC,QAAQ,EAAM;GACd,WAAW,EAAM;EACnB,EAAE,GAEI,IAAY,EAAmB,IAAI;EAEzC,SAAS,EAAY,GAAkB,GAAqB;GACrD,EAAM,cAGX,EAAU,QAAQ,GACd,EAAM,iBACR,EAAM,aAAa,gBAAgB,QACnC,EAAM,aAAa,QACjB,cACA,EAAM,kBAAkB,EAAM,MAAM,EACtC;EAEJ;EAEA,SAAS,EAAW,GAAwB;GACrC,EAAM,cAGX,EAAM,eAAe,GACjB,EAAM,iBACR,EAAM,aAAa,aAAa;EAEpC;EAEA,SAAS,EAAO,GAAkB,GAA2B;GAC3D,IAAI,CAAC,EAAM,aAAa,EAAU,UAAU,MAC1C;GAEF,EAAM,eAAe;GACrB,IAAM,IAAO,CAAC,GAAG,EAAM,KAAK,GACtB,CAAC,KAAS,EAAK,OAAO,EAAU,OAAO,CAAC;GAI9C,AAHA,EAAK,OAAO,GAAa,GAAG,CAAK,GACjC,EAAc,QAAQ,GACtB,EAAU,QAAQ,MAClB,EAAK,WAAW,CAAI;EACtB;EAEA,SAAS,IAAkB;GACzB,EAAU,QAAQ;EACpB;yBAIE,EA0DY,EAzDL,EAAA,QAAa,EAAA,CAAA,IAAI,SAAA,GAAA,EACrB,OAAK,EAAA,CAAA,iBAAiC,EAAA,QAAU,KAAA,mDAAA,CAAA,EAAA,GAAA;oBAUpC,CALK,EAAA,UAAe,EAAA,SAAS,EAAA,aAAA,EAAA,GAA1C,EAKa,EAAA,CAAA,GAAA,EAAA,KAAA,EAAA,GAAA;qBAJoC,CAA9B,EAAA,SAAA,EAAA,GAAjB,EAA+C,EAAA,CAAA,GAAA,EAAA,KAAA,EAAA,GAAA;sBAAZ,CAAA,EAAA,EAAR,EAAA,KAAK,GAAA,CAAA,CAAA,CAAA;;qBACT,EAAA,YAAA,EAAA,GAAvB,EAEkB,EAAA,CAAA,GAAA,EAAA,KAAA,EAAA,GAAA;sBADF,CAAA,EAAA,EAAX,EAAA,QAAQ,GAAA,CAAA,CAAA,CAAA;;;;SAIF,EAAA,SAAS,EAAA,YAAA,EAAA,GADtB,EAUS,UAVT,GAUS,CANG,EAAA,SAAA,EAAA,GAAV,EAEK,MAFL,GAEK,EADA,EAAA,KAAK,GAAA,CAAA,KAAA,EAAA,IAAA,EAAA,GAED,EAAA,YAAA,EAAA,GAAT,EAEI,KAFJ,GAEI,EADC,EAAA,QAAQ,GAAA,CAAA,KAAA,EAAA,IAAA,EAAA,CAAA,CAAA,KAAA,EAAA,IAAA,EAAA,IAAA,EAAA,GAIf,EAgCY,EA/BL,EAAA,QAAa,EAAA,CAAA,IAAW,KAAA,GAAA;IAC7B,OAAM;IACL,OAAK,EAAE,EAAA,KAAS;;qBASN,CAPK,EAAA,MAAM,WAAM,KAAA,EAAA,GAC1B,EAKI,KALJ,GAGC,wBAED,MAAA,EAAA,EAAA,GAGA,EAgBM,GAAA,EAAA,KAAA,EAAA,GAAA,EAfqB,EAAA,QAAjB,GAAO,YADjB,EAgBM,OAAA;KAdH,KAAK,EAAM;KACX,WAAW,EAAA,cAAS;KACpB,0BAAwB,EAAM;KAC9B,OAAK,EAAA;;MAAmD,EAAA,YAAS,gBAAA;MAAmC,EAAA,UAAc,IAAK,eAAA;;KAKvH,cAAS,MAAE,EAAY,GAAQ,CAAK;KACpC,YAAU;KACV,SAAI,MAAE,EAAO,GAAQ,CAAK;KAC1B,WAAS;QAEV,EAA2C,GAAA;KAA5B,MAAM;KAAQ,MAAM,EAAA"}

package/dist/components/compositions/cards/DataTableCard.js

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

package/dist/components/compositions/cards/DataTableCard.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"DataTableCard.js","names":[],"sources":["../../../../src/components/compositions/cards/DataTableCard.vue"],"sourcesContent":["<script setup lang=\"ts\">\n/**\n * Props-driven `datatable` composition.\n *\n * Renders a paginated, searchable, sortable table from `headers` + a\n * row source determined in priority order:\n *\n *   1. `options.searchRoute` — remote fetch (stubbed; future HTTP).\n *   2. `listKey` — read sub-array from `item[listKey]` (nested).\n *   3. `listData` — inline static rows.\n *   4. Otherwise: empty.\n *\n * Sorting, search, and pagination all run client-side over the\n * resolved rows. Column rendering branches on `header.type`.\n *\n * Self-contained — directly mountable in any Vue app:\n *\n *   <DataTableCard\n *     :headers=\"[{ key: 'name', sortable: true }]\"\n *     :list-data=\"rows\"\n *     @action=\"onRowAction\"\n *   />\n */\nimport { computed, ref, watch, toRef } from \"vue\"\nimport type {\n  CreateConfig,\n  DeleteConfig,\n  UpdateConfig,\n} from \"@/definitions/shared/crud\"\nimport type {\n  DataTableColumn,\n  DataTableOptions,\n  ExportConfig,\n  TableAction,\n} from \"@/definitions/cards/DataTableCard\"\nimport {\n  Table,\n  TableBody,\n  TableCell,\n  TableHead,\n  TableHeader,\n  TableRow,\n} from \"@/components/ui/table\"\nimport { Button } from \"@/components/ui/button\"\nimport { Input } from \"@/components/ui/input\"\nimport { useDataTableData } from \"./useDataTableData\"\n\nexport interface DataTableCardProps {\n  /** Title rendered above the table. Falls back to the more generic `title`. */\n  tableTitle?: string\n  title?: string\n  subtitle?: string\n  showCard?: boolean\n  classList?: string[] | string\n  /** Column definitions. */\n  headers?: DataTableColumn[]\n  /** Behaviour and toolbar configuration. */\n  options?: DataTableOptions\n  /** Sub-array path on `item` when rendering nested tables. */\n  listKey?: string\n  /** Static (non-paginated) row source. */\n  listData?: unknown[]\n  /** Per-row action buttons (also merged with `options.additionalActions`). */\n  actions?: TableAction[]\n  /** Enable row selection. */\n  selectable?: boolean\n  /** Bulk action buttons. */\n  bulkActions?: TableAction[]\n  /** Empty-state message. */\n  emptyMessage?: string\n  /** Page-level data model. Used as the row source when `listKey` is set. */\n  item?: Record<string, unknown>\n  /** Create-modal configuration. */\n  createConfig?: CreateConfig\n  /** Inline update configuration. */\n  updateConfig?: UpdateConfig\n  /** Delete configuration. */\n  deleteConfig?: DeleteConfig\n}\n\nconst props = withDefaults(defineProps<DataTableCardProps>(), {\n  headers: () => [],\n  selectable: false,\n  showCard: true,\n  item: () => ({}),\n})\n\nconst emit = defineEmits<{\n  (e: \"action\", payload: { action: TableAction; row: Record<string, unknown> }): void\n  (e: \"export\", payload: { export: ExportConfig }): void\n}>()\n\nconst sortState = ref<{ key: string; direction: \"asc\" | \"desc\" } | null>(\n  props.options?.defaultSortBy\n    ? {\n        key: props.options.defaultSortBy,\n        direction: props.options.defaultSortDirection ?? \"asc\",\n      }\n    : null,\n)\n\nconst searchQuery = ref(\"\")\nconst currentPage = ref(1)\n\nconst perPage = computed<number>(() => {\n  const opts = props.options\n  return (\n    opts?.perPage ??\n    opts?.defaultItemsPerPage ??\n    25\n  )\n})\n\nconst paginated = computed<boolean>(() => props.options?.paginated === true)\n\nconst visibleHeaders = computed<DataTableColumn[]>(() =>\n  (props.headers ?? []).filter((h) => h.visible !== false),\n)\n\nconst emptyMessageText = computed<string>(() => {\n  return (\n    props.emptyMessage ??\n    props.options?.emptyText ??\n    \"No results\"\n  )\n})\n\nconst exports = computed<ExportConfig[]>(\n  () => props.options?.exports ?? [],\n)\n\nconst tableActions = computed<TableAction[]>(() => {\n  const base = props.actions ?? []\n  const additional = props.options?.additionalActions ?? []\n  return [...base, ...additional]\n})\n\nconst showSearch = computed<boolean>(() => {\n  const sr = props.options?.searchRoute\n  if (sr && sr.hide) {\n    return false\n  }\n  // Always show search when there is any data source (client-side filter).\n  return true\n})\n\n/** Underlying row source — composable that can be mocked in tests. */\nconst { rows: sourceRows } = useDataTableData({\n  listKey: toRef(props, \"listKey\"),\n  listData: toRef(props, \"listData\"),\n  options: toRef(props, \"options\"),\n  item: toRef(props, \"item\"),\n})\n\n/** Read a dot-notation path on a row, returning unknown. */\nfunction readPath(row: Record<string, unknown>, path: string): unknown {\n  if (!path) {\n    return undefined\n  }\n  const segments = path.split(\".\")\n  let value: unknown = row\n  for (const seg of segments) {\n    if (value == null || typeof value !== \"object\") {\n      return undefined\n    }\n    value = (value as Record<string, unknown>)[seg]\n  }\n  return value\n}\n\nfunction toComparable(value: unknown): number | string {\n  if (value == null) {\n    return \"\"\n  }\n  if (typeof value === \"number\") {\n    return value\n  }\n  if (typeof value === \"boolean\") {\n    return value ? 1 : 0\n  }\n  if (value instanceof Date) {\n    return value.getTime()\n  }\n  return String(value).toLowerCase()\n}\n\nconst filteredRows = computed<Record<string, unknown>[]>(() => {\n  const query = searchQuery.value.trim().toLowerCase()\n  if (!query) {\n    return sourceRows.value\n  }\n  return sourceRows.value.filter((row) => {\n    return visibleHeaders.value.some((h) => {\n      const v = readPath(row, h.key)\n      if (v == null) {\n        return false\n      }\n      return String(v).toLowerCase().includes(query)\n    })\n  })\n})\n\nconst sortedRows = computed<Record<string, unknown>[]>(() => {\n  const state = sortState.value\n  if (!state) {\n    return filteredRows.value\n  }\n  const dir = state.direction === \"asc\" ? 1 : -1\n  return [...filteredRows.value].sort((a, b) => {\n    const av = toComparable(readPath(a, state.key))\n    const bv = toComparable(readPath(b, state.key))\n    if (av < bv) {\n      return -1 * dir\n    }\n    if (av > bv) {\n      return 1 * dir\n    }\n    return 0\n  })\n})\n\nconst pageCount = computed<number>(() => {\n  if (!paginated.value) {\n    return 1\n  }\n  return Math.max(1, Math.ceil(sortedRows.value.length / perPage.value))\n})\n\nconst pagedRows = computed<Record<string, unknown>[]>(() => {\n  if (!paginated.value) {\n    return sortedRows.value\n  }\n  const start = (currentPage.value - 1) * perPage.value\n  return sortedRows.value.slice(start, start + perPage.value)\n})\n\n// Reset pagination if filtering shrinks the result below the current page.\nwatch([filteredRows, perPage], () => {\n  if (currentPage.value > pageCount.value) {\n    currentPage.value = 1\n  }\n})\n\nfunction toggleSort(header: DataTableColumn): void {\n  if (!header.sortable) {\n    return\n  }\n  const state = sortState.value\n  if (!state || state.key !== header.key) {\n    sortState.value = { key: header.key, direction: \"asc\" }\n    return\n  }\n  if (state.direction === \"asc\") {\n    sortState.value = { key: header.key, direction: \"desc\" }\n    return\n  }\n  sortState.value = null\n}\n\nfunction sortIndicator(header: DataTableColumn): string {\n  const state = sortState.value\n  if (!state || state.key !== header.key) {\n    return \"\"\n  }\n  return state.direction === \"asc\" ? \"↑\" : \"↓\"\n}\n\nfunction alignClass(header: DataTableColumn): string {\n  const a = header.align\n  if (a === \"center\") {\n    return \"text-center\"\n  }\n  if (a === \"end\" || a === \"right\") {\n    return \"text-right\"\n  }\n  return \"text-left\"\n}\n\nfunction previousPage(): void {\n  if (currentPage.value > 1) {\n    currentPage.value -= 1\n  }\n}\n\nfunction nextPage(): void {\n  if (currentPage.value < pageCount.value) {\n    currentPage.value += 1\n  }\n}\n\nfunction formatTimestamp(value: unknown): string {\n  if (value == null) {\n    return \"\"\n  }\n  const date =\n    value instanceof Date\n      ? value\n      : new Date(typeof value === \"number\" ? value : String(value))\n  if (Number.isNaN(date.getTime())) {\n    return String(value)\n  }\n  return new Intl.DateTimeFormat(undefined, {\n    year: \"numeric\",\n    month: \"short\",\n    day: \"numeric\",\n    hour: \"numeric\",\n    minute: \"numeric\",\n  }).format(date)\n}\n\nfunction statusColor(value: unknown): string {\n  const s = String(value ?? \"\").toLowerCase()\n  if (s === \"success\" || s === \"active\" || s === \"ok\" || s === \"paid\") {\n    return \"bg-green-500\"\n  }\n  if (s === \"warning\" || s === \"pending\") {\n    return \"bg-yellow-500\"\n  }\n  if (s === \"danger\" || s === \"error\" || s === \"failed\" || s === \"unpaid\") {\n    return \"bg-red-500\"\n  }\n  if (s === \"info\") {\n    return \"bg-blue-500\"\n  }\n  return \"bg-gray-400\"\n}\n\nfunction onAction(action: TableAction, row: Record<string, unknown>): void {\n  emit(\"action\", { action, row })\n}\n\nfunction onExport(config: ExportConfig): void {\n  emit(\"export\", { export: config })\n}\n</script>\n\n<template>\n  <section\n    :class=\"[\n      'gxp-datatable-card flex flex-col gap-3',\n      showCard !== false\n        ? 'rounded-lg border bg-card text-card-foreground shadow-sm p-4'\n        : '',\n    ]\"\n    data-testid=\"datatable-card\"\n  >\n    <header\n      v-if=\"tableTitle || title || subtitle\"\n      class=\"flex flex-col gap-0.5\"\n    >\n      <h3\n        v-if=\"tableTitle || title\"\n        class=\"text-base font-semibold\"\n      >\n        {{ tableTitle ?? title }}\n      </h3>\n      <p\n        v-if=\"subtitle\"\n        class=\"text-sm text-muted-foreground\"\n      >\n        {{ subtitle }}\n      </p>\n    </header>\n\n    <div\n      v-if=\"exports.length > 0 || showSearch\"\n      class=\"flex flex-wrap items-center justify-between gap-2\"\n    >\n      <div\n        v-if=\"exports.length > 0\"\n        class=\"flex items-center gap-2\"\n        data-testid=\"datatable-exports\"\n      >\n        <Button\n          v-for=\"(ex, i) in exports\"\n          :key=\"i\"\n          variant=\"outline\"\n          size=\"sm\"\n          type=\"button\"\n          @click=\"onExport(ex)\"\n        >\n          {{ ex.label ?? \"Export\" }}\n        </Button>\n      </div>\n\n      <div v-if=\"showSearch\" class=\"ml-auto w-full max-w-xs\">\n        <Input\n          v-model=\"searchQuery\"\n          type=\"search\"\n          placeholder=\"Search...\"\n          data-testid=\"datatable-search\"\n        />\n      </div>\n    </div>\n\n    <Table>\n      <TableHeader>\n        <TableRow>\n          <TableHead\n            v-for=\"h in visibleHeaders\"\n            :key=\"h.key\"\n            :class=\"alignClass(h)\"\n            :style=\"h.width ? { width: h.width } : undefined\"\n          >\n            <button\n              v-if=\"h.sortable\"\n              type=\"button\"\n              class=\"inline-flex items-center gap-1 hover:text-foreground\"\n              :data-testid=\"`sort-${h.key}`\"\n              @click=\"toggleSort(h)\"\n            >\n              <span>{{ h.title ?? h.key }}</span>\n              <span class=\"text-xs\">{{ sortIndicator(h) }}</span>\n            </button>\n            <span v-else>{{ h.title ?? h.key }}</span>\n          </TableHead>\n          <TableHead\n            v-if=\"tableActions.length > 0\"\n            class=\"text-right\"\n          >\n            Actions\n          </TableHead>\n        </TableRow>\n      </TableHeader>\n      <TableBody>\n        <template v-if=\"pagedRows.length > 0\">\n          <TableRow\n            v-for=\"(row, ri) in pagedRows\"\n            :key=\"ri\"\n            :data-testid=\"`datatable-row-${ri}`\"\n          >\n            <TableCell\n              v-for=\"h in visibleHeaders\"\n              :key=\"h.key\"\n              :class=\"alignClass(h)\"\n            >\n              <template v-if=\"h.type === 'timestamp' || h.type === 'laravel-timestamp'\">\n                <span data-testid=\"cell-timestamp\">{{ formatTimestamp(readPath(row, h.key)) }}</span>\n              </template>\n              <template v-else-if=\"h.type === 'boolean'\">\n                <span\n                  data-testid=\"cell-boolean\"\n                  :class=\"readPath(row, h.key) ? 'text-green-600' : 'text-red-600'\"\n                  :aria-label=\"readPath(row, h.key) ? 'true' : 'false'\"\n                >\n                  {{ readPath(row, h.key) ? \"✓\" : \"✗\" }}\n                </span>\n              </template>\n              <template v-else-if=\"h.type === 'image'\">\n                <img\n                  data-testid=\"cell-image\"\n                  :src=\"String(readPath(row, h.key) ?? '')\"\n                  :alt=\"h.title ?? h.key\"\n                  class=\"h-8 w-8 rounded object-cover\"\n                >\n              </template>\n              <template v-else-if=\"h.type === 'status_circle'\">\n                <span class=\"inline-flex items-center gap-2\">\n                  <span\n                    data-testid=\"cell-status-circle\"\n                    :class=\"['inline-block h-2.5 w-2.5 rounded-full', statusColor(readPath(row, h.key))]\"\n                  />\n                  <span>{{ readPath(row, h.key) }}</span>\n                </span>\n              </template>\n              <template v-else>\n                <span>\n                  <template v-if=\"h.prepend\">{{ h.prepend }}</template>\n                  {{ readPath(row, h.key) ?? \"\" }}\n                  <template v-if=\"h.append\">{{ h.append }}</template>\n                </span>\n              </template>\n            </TableCell>\n            <TableCell\n              v-if=\"tableActions.length > 0\"\n              class=\"text-right\"\n            >\n              <div class=\"inline-flex items-center justify-end gap-1\">\n                <Button\n                  v-for=\"(action, ai) in tableActions\"\n                  :key=\"ai\"\n                  variant=\"ghost\"\n                  size=\"sm\"\n                  type=\"button\"\n                  :data-testid=\"`datatable-action-${action.slug ?? ai}`\"\n                  @click=\"onAction(action, row)\"\n                >\n                  {{ action.label ?? action.tooltip ?? action.slug ?? \"Action\" }}\n                </Button>\n              </div>\n            </TableCell>\n          </TableRow>\n        </template>\n        <template v-else>\n          <TableRow>\n            <TableCell\n              :colspan=\"visibleHeaders.length + (tableActions.length > 0 ? 1 : 0)\"\n              class=\"text-center text-muted-foreground\"\n            >\n              <span data-testid=\"datatable-empty\">{{ emptyMessageText }}</span>\n            </TableCell>\n          </TableRow>\n        </template>\n      </TableBody>\n    </Table>\n\n    <footer\n      v-if=\"paginated && sortedRows.length > 0\"\n      class=\"flex items-center justify-between gap-2\"\n      data-testid=\"datatable-pagination\"\n    >\n      <span class=\"text-sm text-muted-foreground\">\n        Page {{ currentPage }} of {{ pageCount }}\n      </span>\n      <div class=\"flex items-center gap-2\">\n        <Button\n          variant=\"outline\"\n          size=\"sm\"\n          type=\"button\"\n          :disabled=\"currentPage <= 1\"\n          data-testid=\"datatable-prev\"\n          @click=\"previousPage\"\n        >\n          Previous\n        </Button>\n        <Button\n          variant=\"outline\"\n          size=\"sm\"\n          type=\"button\"\n          :disabled=\"currentPage >= pageCount\"\n          data-testid=\"datatable-next\"\n          @click=\"nextPage\"\n        >\n          Next\n        </Button>\n      </div>\n    </footer>\n  </section>\n</template>\n"],"mappings":""}

package/dist/components/compositions/cards/DataTableCard.vue_vue_type_script_setup_true_lang.js

@@ -1,317 +0,0 @@
-import e from "../../ui/button/Button.js";
-import "../../ui/button/index.js";
-import t from "../../ui/input/Input.js";
-import "../../ui/input/index.js";
-import n from "../../ui/table/Table.js";
-import r from "../../ui/table/TableBody.js";
-import i from "../../ui/table/TableCell.js";
-import a from "../../ui/table/TableHead.js";
-import o from "../../ui/table/TableHeader.js";
-import s from "../../ui/table/TableRow.js";
-import "../../ui/table/index.js";
-import { useDataTableData as c } from "./useDataTableData.js";
-import { Fragment as l, computed as u, createBlock as d, createCommentVNode as f, createElementBlock as p, createElementVNode as m, createTextVNode as h, createVNode as g, defineComponent as _, normalizeClass as v, normalizeStyle as y, openBlock as b, ref as x, renderList as S, toDisplayString as C, toRef as w, unref as T, watch as E, withCtx as D } from "vue";
-//#region src/components/compositions/cards/DataTableCard.vue?vue&type=script&setup=true&lang.ts
-var O = {
-	key: 0,
-	class: "flex flex-col gap-0.5"
-}, k = {
-	key: 0,
-	class: "text-base font-semibold"
-}, A = {
-	key: 1,
-	class: "text-sm text-muted-foreground"
-}, ee = {
-	key: 1,
-	class: "flex flex-wrap items-center justify-between gap-2"
-}, te = {
-	key: 0,
-	class: "flex items-center gap-2",
-	"data-testid": "datatable-exports"
-}, ne = {
-	key: 1,
-	class: "ml-auto w-full max-w-xs"
-}, re = ["data-testid", "onClick"], ie = { class: "text-xs" }, ae = { key: 1 }, oe = {
-	key: 0,
-	"data-testid": "cell-timestamp"
-}, se = ["aria-label"], ce = ["src", "alt"], le = {
-	key: 3,
-	class: "inline-flex items-center gap-2"
-}, ue = { key: 4 }, de = { class: "inline-flex items-center justify-end gap-1" }, fe = { "data-testid": "datatable-empty" }, pe = {
-	key: 2,
-	class: "flex items-center justify-between gap-2",
-	"data-testid": "datatable-pagination"
-}, j = { class: "text-sm text-muted-foreground" }, M = { class: "flex items-center gap-2" }, N = /* @__PURE__ */ _({
-	__name: "DataTableCard",
-	props: {
-		tableTitle: {},
-		title: {},
-		subtitle: {},
-		showCard: {
-			type: Boolean,
-			default: !0
-		},
-		classList: {},
-		headers: { default: () => [] },
-		options: {},
-		listKey: {},
-		listData: {},
-		actions: {},
-		selectable: {
-			type: Boolean,
-			default: !1
-		},
-		bulkActions: {},
-		emptyMessage: {},
-		item: { default: () => ({}) },
-		createConfig: {},
-		updateConfig: {},
-		deleteConfig: {}
-	},
-	emits: ["action", "export"],
-	setup(_, { emit: N }) {
-		let P = _, F = N, I = x(P.options?.defaultSortBy ? {
-			key: P.options.defaultSortBy,
-			direction: P.options.defaultSortDirection ?? "asc"
-		} : null), L = x(""), R = x(1), z = u(() => {
-			let e = P.options;
-			return e?.perPage ?? e?.defaultItemsPerPage ?? 25;
-		}), B = u(() => P.options?.paginated === !0), V = u(() => (P.headers ?? []).filter((e) => e.visible !== !1)), me = u(() => P.emptyMessage ?? P.options?.emptyText ?? "No results"), H = u(() => P.options?.exports ?? []), U = u(() => {
-			let e = P.actions ?? [], t = P.options?.additionalActions ?? [];
-			return [...e, ...t];
-		}), W = u(() => {
-			let e = P.options?.searchRoute;
-			return !(e && e.hide);
-		}), { rows: G } = c({
-			listKey: w(P, "listKey"),
-			listData: w(P, "listData"),
-			options: w(P, "options"),
-			item: w(P, "item")
-		});
-		function K(e, t) {
-			if (!t) return;
-			let n = t.split("."), r = e;
-			for (let e of n) {
-				if (typeof r != "object" || !r) return;
-				r = r[e];
-			}
-			return r;
-		}
-		function q(e) {
-			return e == null ? "" : typeof e == "number" ? e : typeof e == "boolean" ? +!!e : e instanceof Date ? e.getTime() : String(e).toLowerCase();
-		}
-		let J = u(() => {
-			let e = L.value.trim().toLowerCase();
-			return e ? G.value.filter((t) => V.value.some((n) => {
-				let r = K(t, n.key);
-				return r == null ? !1 : String(r).toLowerCase().includes(e);
-			})) : G.value;
-		}), Y = u(() => {
-			let e = I.value;
-			if (!e) return J.value;
-			let t = e.direction === "asc" ? 1 : -1;
-			return [...J.value].sort((n, r) => {
-				let i = q(K(n, e.key)), a = q(K(r, e.key));
-				return i < a ? -1 * t : i > a ? 1 * t : 0;
-			});
-		}), X = u(() => B.value ? Math.max(1, Math.ceil(Y.value.length / z.value)) : 1), Z = u(() => {
-			if (!B.value) return Y.value;
-			let e = (R.value - 1) * z.value;
-			return Y.value.slice(e, e + z.value);
-		});
-		E([J, z], () => {
-			R.value > X.value && (R.value = 1);
-		});
-		function he(e) {
-			if (!e.sortable) return;
-			let t = I.value;
-			if (!t || t.key !== e.key) {
-				I.value = {
-					key: e.key,
-					direction: "asc"
-				};
-				return;
-			}
-			if (t.direction === "asc") {
-				I.value = {
-					key: e.key,
-					direction: "desc"
-				};
-				return;
-			}
-			I.value = null;
-		}
-		function ge(e) {
-			let t = I.value;
-			return !t || t.key !== e.key ? "" : t.direction === "asc" ? "↑" : "↓";
-		}
-		function Q(e) {
-			let t = e.align;
-			return t === "center" ? "text-center" : t === "end" || t === "right" ? "text-right" : "text-left";
-		}
-		function $() {
-			R.value > 1 && --R.value;
-		}
-		function _e() {
-			R.value < X.value && (R.value += 1);
-		}
-		function ve(e) {
-			if (e == null) return "";
-			let t = e instanceof Date ? e : new Date(typeof e == "number" ? e : String(e));
-			return Number.isNaN(t.getTime()) ? String(e) : new Intl.DateTimeFormat(void 0, {
-				year: "numeric",
-				month: "short",
-				day: "numeric",
-				hour: "numeric",
-				minute: "numeric"
-			}).format(t);
-		}
-		function ye(e) {
-			let t = String(e ?? "").toLowerCase();
-			return t === "success" || t === "active" || t === "ok" || t === "paid" ? "bg-green-500" : t === "warning" || t === "pending" ? "bg-yellow-500" : t === "danger" || t === "error" || t === "failed" || t === "unpaid" ? "bg-red-500" : t === "info" ? "bg-blue-500" : "bg-gray-400";
-		}
-		function be(e, t) {
-			F("action", {
-				action: e,
-				row: t
-			});
-		}
-		function xe(e) {
-			F("export", { export: e });
-		}
-		return (c, u) => (b(), p("section", {
-			class: v(["gxp-datatable-card flex flex-col gap-3", _.showCard === !1 ? "" : "rounded-lg border bg-card text-card-foreground shadow-sm p-4"]),
-			"data-testid": "datatable-card"
-		}, [
-			_.tableTitle || _.title || _.subtitle ? (b(), p("header", O, [_.tableTitle || _.title ? (b(), p("h3", k, C(_.tableTitle ?? _.title), 1)) : f("", !0), _.subtitle ? (b(), p("p", A, C(_.subtitle), 1)) : f("", !0)])) : f("", !0),
-			H.value.length > 0 || W.value ? (b(), p("div", ee, [H.value.length > 0 ? (b(), p("div", te, [(b(!0), p(l, null, S(H.value, (t, n) => (b(), d(T(e), {
-				key: n,
-				variant: "outline",
-				size: "sm",
-				type: "button",
-				onClick: (e) => xe(t)
-			}, {
-				default: D(() => [h(C(t.label ?? "Export"), 1)]),
-				_: 2
-			}, 1032, ["onClick"]))), 128))])) : f("", !0), W.value ? (b(), p("div", ne, [g(T(t), {
-				modelValue: L.value,
-				"onUpdate:modelValue": u[0] ||= (e) => L.value = e,
-				type: "search",
-				placeholder: "Search...",
-				"data-testid": "datatable-search"
-			}, null, 8, ["modelValue"])])) : f("", !0)])) : f("", !0),
-			g(T(n), null, {
-				default: D(() => [g(T(o), null, {
-					default: D(() => [g(T(s), null, {
-						default: D(() => [(b(!0), p(l, null, S(V.value, (e) => (b(), d(T(a), {
-							key: e.key,
-							class: v(Q(e)),
-							style: y(e.width ? { width: e.width } : void 0)
-						}, {
-							default: D(() => [e.sortable ? (b(), p("button", {
-								key: 0,
-								type: "button",
-								class: "inline-flex items-center gap-1 hover:text-foreground",
-								"data-testid": `sort-${e.key}`,
-								onClick: (t) => he(e)
-							}, [m("span", null, C(e.title ?? e.key), 1), m("span", ie, C(ge(e)), 1)], 8, re)) : (b(), p("span", ae, C(e.title ?? e.key), 1))]),
-							_: 2
-						}, 1032, ["class", "style"]))), 128)), U.value.length > 0 ? (b(), d(T(a), {
-							key: 0,
-							class: "text-right"
-						}, {
-							default: D(() => [...u[1] ||= [h(" Actions ", -1)]]),
-							_: 1
-						})) : f("", !0)]),
-						_: 1
-					})]),
-					_: 1
-				}), g(T(r), null, {
-					default: D(() => [Z.value.length > 0 ? (b(!0), p(l, { key: 0 }, S(Z.value, (t, n) => (b(), d(T(s), {
-						key: n,
-						"data-testid": `datatable-row-${n}`
-					}, {
-						default: D(() => [(b(!0), p(l, null, S(V.value, (e) => (b(), d(T(i), {
-							key: e.key,
-							class: v(Q(e))
-						}, {
-							default: D(() => [e.type === "timestamp" || e.type === "laravel-timestamp" ? (b(), p("span", oe, C(ve(K(t, e.key))), 1)) : e.type === "boolean" ? (b(), p("span", {
-								key: 1,
-								"data-testid": "cell-boolean",
-								class: v(K(t, e.key) ? "text-green-600" : "text-red-600"),
-								"aria-label": K(t, e.key) ? "true" : "false"
-							}, C(K(t, e.key) ? "✓" : "✗"), 11, se)) : e.type === "image" ? (b(), p("img", {
-								key: 2,
-								"data-testid": "cell-image",
-								src: String(K(t, e.key) ?? ""),
-								alt: e.title ?? e.key,
-								class: "h-8 w-8 rounded object-cover"
-							}, null, 8, ce)) : e.type === "status_circle" ? (b(), p("span", le, [m("span", {
-								"data-testid": "cell-status-circle",
-								class: v(["inline-block h-2.5 w-2.5 rounded-full", ye(K(t, e.key))])
-							}, null, 2), m("span", null, C(K(t, e.key)), 1)])) : (b(), p("span", ue, [
-								e.prepend ? (b(), p(l, { key: 0 }, [h(C(e.prepend), 1)], 64)) : f("", !0),
-								h(" " + C(K(t, e.key) ?? "") + " ", 1),
-								e.append ? (b(), p(l, { key: 1 }, [h(C(e.append), 1)], 64)) : f("", !0)
-							]))]),
-							_: 2
-						}, 1032, ["class"]))), 128)), U.value.length > 0 ? (b(), d(T(i), {
-							key: 0,
-							class: "text-right"
-						}, {
-							default: D(() => [m("div", de, [(b(!0), p(l, null, S(U.value, (n, r) => (b(), d(T(e), {
-								key: r,
-								variant: "ghost",
-								size: "sm",
-								type: "button",
-								"data-testid": `datatable-action-${n.slug ?? r}`,
-								onClick: (e) => be(n, t)
-							}, {
-								default: D(() => [h(C(n.label ?? n.tooltip ?? n.slug ?? "Action"), 1)]),
-								_: 2
-							}, 1032, ["data-testid", "onClick"]))), 128))])]),
-							_: 2
-						}, 1024)) : f("", !0)]),
-						_: 2
-					}, 1032, ["data-testid"]))), 128)) : (b(), d(T(s), { key: 1 }, {
-						default: D(() => [g(T(i), {
-							colspan: V.value.length + +(U.value.length > 0),
-							class: "text-center text-muted-foreground"
-						}, {
-							default: D(() => [m("span", fe, C(me.value), 1)]),
-							_: 1
-						}, 8, ["colspan"])]),
-						_: 1
-					}))]),
-					_: 1
-				})]),
-				_: 1
-			}),
-			B.value && Y.value.length > 0 ? (b(), p("footer", pe, [m("span", j, " Page " + C(R.value) + " of " + C(X.value), 1), m("div", M, [g(T(e), {
-				variant: "outline",
-				size: "sm",
-				type: "button",
-				disabled: R.value <= 1,
-				"data-testid": "datatable-prev",
-				onClick: $
-			}, {
-				default: D(() => [...u[2] ||= [h(" Previous ", -1)]]),
-				_: 1
-			}, 8, ["disabled"]), g(T(e), {
-				variant: "outline",
-				size: "sm",
-				type: "button",
-				disabled: R.value >= X.value,
-				"data-testid": "datatable-next",
-				onClick: _e
-			}, {
-				default: D(() => [...u[3] ||= [h(" Next ", -1)]]),
-				_: 1
-			}, 8, ["disabled"])])])) : f("", !0)
-		], 2));
-	}
-});
-//#endregion
-export { N as default };
-
-//# sourceMappingURL=DataTableCard.vue_vue_type_script_setup_true_lang.js.map

package/dist/components/compositions/cards/DataTableCard.vue_vue_type_script_setup_true_lang.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"DataTableCard.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../../src/components/compositions/cards/DataTableCard.vue"],"sourcesContent":["<script setup lang=\"ts\">\n/**\n * Props-driven `datatable` composition.\n *\n * Renders a paginated, searchable, sortable table from `headers` + a\n * row source determined in priority order:\n *\n *   1. `options.searchRoute` — remote fetch (stubbed; future HTTP).\n *   2. `listKey` — read sub-array from `item[listKey]` (nested).\n *   3. `listData` — inline static rows.\n *   4. Otherwise: empty.\n *\n * Sorting, search, and pagination all run client-side over the\n * resolved rows. Column rendering branches on `header.type`.\n *\n * Self-contained — directly mountable in any Vue app:\n *\n *   <DataTableCard\n *     :headers=\"[{ key: 'name', sortable: true }]\"\n *     :list-data=\"rows\"\n *     @action=\"onRowAction\"\n *   />\n */\nimport { computed, ref, watch, toRef } from \"vue\"\nimport type {\n  CreateConfig,\n  DeleteConfig,\n  UpdateConfig,\n} from \"@/definitions/shared/crud\"\nimport type {\n  DataTableColumn,\n  DataTableOptions,\n  ExportConfig,\n  TableAction,\n} from \"@/definitions/cards/DataTableCard\"\nimport {\n  Table,\n  TableBody,\n  TableCell,\n  TableHead,\n  TableHeader,\n  TableRow,\n} from \"@/components/ui/table\"\nimport { Button } from \"@/components/ui/button\"\nimport { Input } from \"@/components/ui/input\"\nimport { useDataTableData } from \"./useDataTableData\"\n\nexport interface DataTableCardProps {\n  /** Title rendered above the table. Falls back to the more generic `title`. */\n  tableTitle?: string\n  title?: string\n  subtitle?: string\n  showCard?: boolean\n  classList?: string[] | string\n  /** Column definitions. */\n  headers?: DataTableColumn[]\n  /** Behaviour and toolbar configuration. */\n  options?: DataTableOptions\n  /** Sub-array path on `item` when rendering nested tables. */\n  listKey?: string\n  /** Static (non-paginated) row source. */\n  listData?: unknown[]\n  /** Per-row action buttons (also merged with `options.additionalActions`). */\n  actions?: TableAction[]\n  /** Enable row selection. */\n  selectable?: boolean\n  /** Bulk action buttons. */\n  bulkActions?: TableAction[]\n  /** Empty-state message. */\n  emptyMessage?: string\n  /** Page-level data model. Used as the row source when `listKey` is set. */\n  item?: Record<string, unknown>\n  /** Create-modal configuration. */\n  createConfig?: CreateConfig\n  /** Inline update configuration. */\n  updateConfig?: UpdateConfig\n  /** Delete configuration. */\n  deleteConfig?: DeleteConfig\n}\n\nconst props = withDefaults(defineProps<DataTableCardProps>(), {\n  headers: () => [],\n  selectable: false,\n  showCard: true,\n  item: () => ({}),\n})\n\nconst emit = defineEmits<{\n  (e: \"action\", payload: { action: TableAction; row: Record<string, unknown> }): void\n  (e: \"export\", payload: { export: ExportConfig }): void\n}>()\n\nconst sortState = ref<{ key: string; direction: \"asc\" | \"desc\" } | null>(\n  props.options?.defaultSortBy\n    ? {\n        key: props.options.defaultSortBy,\n        direction: props.options.defaultSortDirection ?? \"asc\",\n      }\n    : null,\n)\n\nconst searchQuery = ref(\"\")\nconst currentPage = ref(1)\n\nconst perPage = computed<number>(() => {\n  const opts = props.options\n  return (\n    opts?.perPage ??\n    opts?.defaultItemsPerPage ??\n    25\n  )\n})\n\nconst paginated = computed<boolean>(() => props.options?.paginated === true)\n\nconst visibleHeaders = computed<DataTableColumn[]>(() =>\n  (props.headers ?? []).filter((h) => h.visible !== false),\n)\n\nconst emptyMessageText = computed<string>(() => {\n  return (\n    props.emptyMessage ??\n    props.options?.emptyText ??\n    \"No results\"\n  )\n})\n\nconst exports = computed<ExportConfig[]>(\n  () => props.options?.exports ?? [],\n)\n\nconst tableActions = computed<TableAction[]>(() => {\n  const base = props.actions ?? []\n  const additional = props.options?.additionalActions ?? []\n  return [...base, ...additional]\n})\n\nconst showSearch = computed<boolean>(() => {\n  const sr = props.options?.searchRoute\n  if (sr && sr.hide) {\n    return false\n  }\n  // Always show search when there is any data source (client-side filter).\n  return true\n})\n\n/** Underlying row source — composable that can be mocked in tests. */\nconst { rows: sourceRows } = useDataTableData({\n  listKey: toRef(props, \"listKey\"),\n  listData: toRef(props, \"listData\"),\n  options: toRef(props, \"options\"),\n  item: toRef(props, \"item\"),\n})\n\n/** Read a dot-notation path on a row, returning unknown. */\nfunction readPath(row: Record<string, unknown>, path: string): unknown {\n  if (!path) {\n    return undefined\n  }\n  const segments = path.split(\".\")\n  let value: unknown = row\n  for (const seg of segments) {\n    if (value == null || typeof value !== \"object\") {\n      return undefined\n    }\n    value = (value as Record<string, unknown>)[seg]\n  }\n  return value\n}\n\nfunction toComparable(value: unknown): number | string {\n  if (value == null) {\n    return \"\"\n  }\n  if (typeof value === \"number\") {\n    return value\n  }\n  if (typeof value === \"boolean\") {\n    return value ? 1 : 0\n  }\n  if (value instanceof Date) {\n    return value.getTime()\n  }\n  return String(value).toLowerCase()\n}\n\nconst filteredRows = computed<Record<string, unknown>[]>(() => {\n  const query = searchQuery.value.trim().toLowerCase()\n  if (!query) {\n    return sourceRows.value\n  }\n  return sourceRows.value.filter((row) => {\n    return visibleHeaders.value.some((h) => {\n      const v = readPath(row, h.key)\n      if (v == null) {\n        return false\n      }\n      return String(v).toLowerCase().includes(query)\n    })\n  })\n})\n\nconst sortedRows = computed<Record<string, unknown>[]>(() => {\n  const state = sortState.value\n  if (!state) {\n    return filteredRows.value\n  }\n  const dir = state.direction === \"asc\" ? 1 : -1\n  return [...filteredRows.value].sort((a, b) => {\n    const av = toComparable(readPath(a, state.key))\n    const bv = toComparable(readPath(b, state.key))\n    if (av < bv) {\n      return -1 * dir\n    }\n    if (av > bv) {\n      return 1 * dir\n    }\n    return 0\n  })\n})\n\nconst pageCount = computed<number>(() => {\n  if (!paginated.value) {\n    return 1\n  }\n  return Math.max(1, Math.ceil(sortedRows.value.length / perPage.value))\n})\n\nconst pagedRows = computed<Record<string, unknown>[]>(() => {\n  if (!paginated.value) {\n    return sortedRows.value\n  }\n  const start = (currentPage.value - 1) * perPage.value\n  return sortedRows.value.slice(start, start + perPage.value)\n})\n\n// Reset pagination if filtering shrinks the result below the current page.\nwatch([filteredRows, perPage], () => {\n  if (currentPage.value > pageCount.value) {\n    currentPage.value = 1\n  }\n})\n\nfunction toggleSort(header: DataTableColumn): void {\n  if (!header.sortable) {\n    return\n  }\n  const state = sortState.value\n  if (!state || state.key !== header.key) {\n    sortState.value = { key: header.key, direction: \"asc\" }\n    return\n  }\n  if (state.direction === \"asc\") {\n    sortState.value = { key: header.key, direction: \"desc\" }\n    return\n  }\n  sortState.value = null\n}\n\nfunction sortIndicator(header: DataTableColumn): string {\n  const state = sortState.value\n  if (!state || state.key !== header.key) {\n    return \"\"\n  }\n  return state.direction === \"asc\" ? \"↑\" : \"↓\"\n}\n\nfunction alignClass(header: DataTableColumn): string {\n  const a = header.align\n  if (a === \"center\") {\n    return \"text-center\"\n  }\n  if (a === \"end\" || a === \"right\") {\n    return \"text-right\"\n  }\n  return \"text-left\"\n}\n\nfunction previousPage(): void {\n  if (currentPage.value > 1) {\n    currentPage.value -= 1\n  }\n}\n\nfunction nextPage(): void {\n  if (currentPage.value < pageCount.value) {\n    currentPage.value += 1\n  }\n}\n\nfunction formatTimestamp(value: unknown): string {\n  if (value == null) {\n    return \"\"\n  }\n  const date =\n    value instanceof Date\n      ? value\n      : new Date(typeof value === \"number\" ? value : String(value))\n  if (Number.isNaN(date.getTime())) {\n    return String(value)\n  }\n  return new Intl.DateTimeFormat(undefined, {\n    year: \"numeric\",\n    month: \"short\",\n    day: \"numeric\",\n    hour: \"numeric\",\n    minute: \"numeric\",\n  }).format(date)\n}\n\nfunction statusColor(value: unknown): string {\n  const s = String(value ?? \"\").toLowerCase()\n  if (s === \"success\" || s === \"active\" || s === \"ok\" || s === \"paid\") {\n    return \"bg-green-500\"\n  }\n  if (s === \"warning\" || s === \"pending\") {\n    return \"bg-yellow-500\"\n  }\n  if (s === \"danger\" || s === \"error\" || s === \"failed\" || s === \"unpaid\") {\n    return \"bg-red-500\"\n  }\n  if (s === \"info\") {\n    return \"bg-blue-500\"\n  }\n  return \"bg-gray-400\"\n}\n\nfunction onAction(action: TableAction, row: Record<string, unknown>): void {\n  emit(\"action\", { action, row })\n}\n\nfunction onExport(config: ExportConfig): void {\n  emit(\"export\", { export: config })\n}\n</script>\n\n<template>\n  <section\n    :class=\"[\n      'gxp-datatable-card flex flex-col gap-3',\n      showCard !== false\n        ? 'rounded-lg border bg-card text-card-foreground shadow-sm p-4'\n        : '',\n    ]\"\n    data-testid=\"datatable-card\"\n  >\n    <header\n      v-if=\"tableTitle || title || subtitle\"\n      class=\"flex flex-col gap-0.5\"\n    >\n      <h3\n        v-if=\"tableTitle || title\"\n        class=\"text-base font-semibold\"\n      >\n        {{ tableTitle ?? title }}\n      </h3>\n      <p\n        v-if=\"subtitle\"\n        class=\"text-sm text-muted-foreground\"\n      >\n        {{ subtitle }}\n      </p>\n    </header>\n\n    <div\n      v-if=\"exports.length > 0 || showSearch\"\n      class=\"flex flex-wrap items-center justify-between gap-2\"\n    >\n      <div\n        v-if=\"exports.length > 0\"\n        class=\"flex items-center gap-2\"\n        data-testid=\"datatable-exports\"\n      >\n        <Button\n          v-for=\"(ex, i) in exports\"\n          :key=\"i\"\n          variant=\"outline\"\n          size=\"sm\"\n          type=\"button\"\n          @click=\"onExport(ex)\"\n        >\n          {{ ex.label ?? \"Export\" }}\n        </Button>\n      </div>\n\n      <div v-if=\"showSearch\" class=\"ml-auto w-full max-w-xs\">\n        <Input\n          v-model=\"searchQuery\"\n          type=\"search\"\n          placeholder=\"Search...\"\n          data-testid=\"datatable-search\"\n        />\n      </div>\n    </div>\n\n    <Table>\n      <TableHeader>\n        <TableRow>\n          <TableHead\n            v-for=\"h in visibleHeaders\"\n            :key=\"h.key\"\n            :class=\"alignClass(h)\"\n            :style=\"h.width ? { width: h.width } : undefined\"\n          >\n            <button\n              v-if=\"h.sortable\"\n              type=\"button\"\n              class=\"inline-flex items-center gap-1 hover:text-foreground\"\n              :data-testid=\"`sort-${h.key}`\"\n              @click=\"toggleSort(h)\"\n            >\n              <span>{{ h.title ?? h.key }}</span>\n              <span class=\"text-xs\">{{ sortIndicator(h) }}</span>\n            </button>\n            <span v-else>{{ h.title ?? h.key }}</span>\n          </TableHead>\n          <TableHead\n            v-if=\"tableActions.length > 0\"\n            class=\"text-right\"\n          >\n            Actions\n          </TableHead>\n        </TableRow>\n      </TableHeader>\n      <TableBody>\n        <template v-if=\"pagedRows.length > 0\">\n          <TableRow\n            v-for=\"(row, ri) in pagedRows\"\n            :key=\"ri\"\n            :data-testid=\"`datatable-row-${ri}`\"\n          >\n            <TableCell\n              v-for=\"h in visibleHeaders\"\n              :key=\"h.key\"\n              :class=\"alignClass(h)\"\n            >\n              <template v-if=\"h.type === 'timestamp' || h.type === 'laravel-timestamp'\">\n                <span data-testid=\"cell-timestamp\">{{ formatTimestamp(readPath(row, h.key)) }}</span>\n              </template>\n              <template v-else-if=\"h.type === 'boolean'\">\n                <span\n                  data-testid=\"cell-boolean\"\n                  :class=\"readPath(row, h.key) ? 'text-green-600' : 'text-red-600'\"\n                  :aria-label=\"readPath(row, h.key) ? 'true' : 'false'\"\n                >\n                  {{ readPath(row, h.key) ? \"✓\" : \"✗\" }}\n                </span>\n              </template>\n              <template v-else-if=\"h.type === 'image'\">\n                <img\n                  data-testid=\"cell-image\"\n                  :src=\"String(readPath(row, h.key) ?? '')\"\n                  :alt=\"h.title ?? h.key\"\n                  class=\"h-8 w-8 rounded object-cover\"\n                >\n              </template>\n              <template v-else-if=\"h.type === 'status_circle'\">\n                <span class=\"inline-flex items-center gap-2\">\n                  <span\n                    data-testid=\"cell-status-circle\"\n                    :class=\"['inline-block h-2.5 w-2.5 rounded-full', statusColor(readPath(row, h.key))]\"\n                  />\n                  <span>{{ readPath(row, h.key) }}</span>\n                </span>\n              </template>\n              <template v-else>\n                <span>\n                  <template v-if=\"h.prepend\">{{ h.prepend }}</template>\n                  {{ readPath(row, h.key) ?? \"\" }}\n                  <template v-if=\"h.append\">{{ h.append }}</template>\n                </span>\n              </template>\n            </TableCell>\n            <TableCell\n              v-if=\"tableActions.length > 0\"\n              class=\"text-right\"\n            >\n              <div class=\"inline-flex items-center justify-end gap-1\">\n                <Button\n                  v-for=\"(action, ai) in tableActions\"\n                  :key=\"ai\"\n                  variant=\"ghost\"\n                  size=\"sm\"\n                  type=\"button\"\n                  :data-testid=\"`datatable-action-${action.slug ?? ai}`\"\n                  @click=\"onAction(action, row)\"\n                >\n                  {{ action.label ?? action.tooltip ?? action.slug ?? \"Action\" }}\n                </Button>\n              </div>\n            </TableCell>\n          </TableRow>\n        </template>\n        <template v-else>\n          <TableRow>\n            <TableCell\n              :colspan=\"visibleHeaders.length + (tableActions.length > 0 ? 1 : 0)\"\n              class=\"text-center text-muted-foreground\"\n            >\n              <span data-testid=\"datatable-empty\">{{ emptyMessageText }}</span>\n            </TableCell>\n          </TableRow>\n        </template>\n      </TableBody>\n    </Table>\n\n    <footer\n      v-if=\"paginated && sortedRows.length > 0\"\n      class=\"flex items-center justify-between gap-2\"\n      data-testid=\"datatable-pagination\"\n    >\n      <span class=\"text-sm text-muted-foreground\">\n        Page {{ currentPage }} of {{ pageCount }}\n      </span>\n      <div class=\"flex items-center gap-2\">\n        <Button\n          variant=\"outline\"\n          size=\"sm\"\n          type=\"button\"\n          :disabled=\"currentPage <= 1\"\n          data-testid=\"datatable-prev\"\n          @click=\"previousPage\"\n        >\n          Previous\n        </Button>\n        <Button\n          variant=\"outline\"\n          size=\"sm\"\n          type=\"button\"\n          :disabled=\"currentPage >= pageCount\"\n          data-testid=\"datatable-next\"\n          @click=\"nextPage\"\n        >\n          Next\n        </Button>\n      </div>\n    </footer>\n  </section>\n</template>\n"],"mappings":"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"}

package/dist/components/compositions/cards/ElementDisplayCard.js

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

package/dist/components/compositions/cards/ElementDisplayCard.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"ElementDisplayCard.js","names":[],"sources":["../../../../src/components/compositions/cards/ElementDisplayCard.vue"],"sourcesContent":["<script setup lang=\"ts\">\n/**\n * Props-driven `element-display` composition. Renders a single\n * CardElement standalone (no label, no column wrapping, no card chrome\n * by default).\n *\n * Self-contained — directly mountable in any Vue app:\n *\n *   <ElementDisplayCard\n *     :element=\"myChartElement\"\n *     :item=\"dataModel\"\n *     title=\"Featured widget\"\n *     show-card\n *   />\n *\n * Renders nothing when `element` is not provided — keeps a missing\n * reference from breaking the page. ID resolution happens upstream in\n * `CardRenderer`.\n */\nimport { computed } from \"vue\"\nimport type { CardElement } from \"@/definitions/elements\"\nimport ElementRenderer from \"@/engine/ElementRenderer.vue\"\nimport {\n  Card,\n  CardContent,\n  CardDescription,\n  CardHeader,\n  CardTitle,\n} from \"@/components/ui/card\"\n\nexport interface ElementDisplayCardProps {\n  title?: string\n  subtitle?: string\n  showCard?: boolean\n  /** Resolved element to render. */\n  element?: CardElement\n  /** Page-level data model passed through to the element renderer. */\n  item?: Record<string, unknown>\n}\n\nconst props = withDefaults(defineProps<ElementDisplayCardProps>(), {\n  showCard: false,\n  item: () => ({}),\n})\n\nconst showChrome = computed<boolean>(() => props.showCard === true)\n\nconst hasHeader = computed<boolean>(\n  () => Boolean(props.title) || Boolean(props.subtitle),\n)\n</script>\n\n<template>\n  <Card v-if=\"showChrome && element\" class=\"flex flex-col\">\n    <CardHeader v-if=\"hasHeader\">\n      <CardTitle v-if=\"title\">{{ title }}</CardTitle>\n      <CardDescription v-if=\"subtitle\">\n        {{ subtitle }}\n      </CardDescription>\n    </CardHeader>\n    <CardContent :class=\"[hasHeader ? '' : 'pt-6']\">\n      <ElementRenderer :element=\"element\" :item=\"item\" />\n    </CardContent>\n  </Card>\n  <ElementRenderer\n    v-else-if=\"element\"\n    :element=\"element\"\n    :item=\"item\"\n  />\n</template>\n"],"mappings":""}

package/dist/components/compositions/cards/ElementDisplayCard.vue_vue_type_script_setup_true_lang.js

@@ -1,55 +0,0 @@
-import e from "../../ui/card/Card.js";
-import t from "../../ui/card/CardContent.js";
-import n from "../../ui/card/CardDescription.js";
-import r from "../../ui/card/CardHeader.js";
-import i from "../../ui/card/CardTitle.js";
-import "../../ui/card/index.js";
-import a from "../../../engine/ElementRenderer.js";
-import { computed as o, createBlock as s, createCommentVNode as c, createTextVNode as l, createVNode as u, defineComponent as d, normalizeClass as f, openBlock as p, toDisplayString as m, unref as h, withCtx as g } from "vue";
-//#region src/components/compositions/cards/ElementDisplayCard.vue?vue&type=script&setup=true&lang.ts
-var _ = /* @__PURE__ */ d({
-	__name: "ElementDisplayCard",
-	props: {
-		title: {},
-		subtitle: {},
-		showCard: {
-			type: Boolean,
-			default: !1
-		},
-		element: {},
-		item: { default: () => ({}) }
-	},
-	setup(d) {
-		let _ = d, v = o(() => _.showCard === !0), y = o(() => !!_.title || !!_.subtitle);
-		return (o, _) => v.value && d.element ? (p(), s(h(e), {
-			key: 0,
-			class: "flex flex-col"
-		}, {
-			default: g(() => [y.value ? (p(), s(h(r), { key: 0 }, {
-				default: g(() => [d.title ? (p(), s(h(i), { key: 0 }, {
-					default: g(() => [l(m(d.title), 1)]),
-					_: 1
-				})) : c("", !0), d.subtitle ? (p(), s(h(n), { key: 1 }, {
-					default: g(() => [l(m(d.subtitle), 1)]),
-					_: 1
-				})) : c("", !0)]),
-				_: 1
-			})) : c("", !0), u(h(t), { class: f([y.value ? "" : "pt-6"]) }, {
-				default: g(() => [u(a, {
-					element: d.element,
-					item: d.item
-				}, null, 8, ["element", "item"])]),
-				_: 1
-			}, 8, ["class"])]),
-			_: 1
-		})) : d.element ? (p(), s(a, {
-			key: 1,
-			element: d.element,
-			item: d.item
-		}, null, 8, ["element", "item"])) : c("", !0);
-	}
-});
-//#endregion
-export { _ as default };
-
-//# sourceMappingURL=ElementDisplayCard.vue_vue_type_script_setup_true_lang.js.map

package/dist/components/compositions/cards/ElementDisplayCard.vue_vue_type_script_setup_true_lang.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"ElementDisplayCard.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../../src/components/compositions/cards/ElementDisplayCard.vue"],"sourcesContent":["<script setup lang=\"ts\">\n/**\n * Props-driven `element-display` composition. Renders a single\n * CardElement standalone (no label, no column wrapping, no card chrome\n * by default).\n *\n * Self-contained — directly mountable in any Vue app:\n *\n *   <ElementDisplayCard\n *     :element=\"myChartElement\"\n *     :item=\"dataModel\"\n *     title=\"Featured widget\"\n *     show-card\n *   />\n *\n * Renders nothing when `element` is not provided — keeps a missing\n * reference from breaking the page. ID resolution happens upstream in\n * `CardRenderer`.\n */\nimport { computed } from \"vue\"\nimport type { CardElement } from \"@/definitions/elements\"\nimport ElementRenderer from \"@/engine/ElementRenderer.vue\"\nimport {\n  Card,\n  CardContent,\n  CardDescription,\n  CardHeader,\n  CardTitle,\n} from \"@/components/ui/card\"\n\nexport interface ElementDisplayCardProps {\n  title?: string\n  subtitle?: string\n  showCard?: boolean\n  /** Resolved element to render. */\n  element?: CardElement\n  /** Page-level data model passed through to the element renderer. */\n  item?: Record<string, unknown>\n}\n\nconst props = withDefaults(defineProps<ElementDisplayCardProps>(), {\n  showCard: false,\n  item: () => ({}),\n})\n\nconst showChrome = computed<boolean>(() => props.showCard === true)\n\nconst hasHeader = computed<boolean>(\n  () => Boolean(props.title) || Boolean(props.subtitle),\n)\n</script>\n\n<template>\n  <Card v-if=\"showChrome && element\" class=\"flex flex-col\">\n    <CardHeader v-if=\"hasHeader\">\n      <CardTitle v-if=\"title\">{{ title }}</CardTitle>\n      <CardDescription v-if=\"subtitle\">\n        {{ subtitle }}\n      </CardDescription>\n    </CardHeader>\n    <CardContent :class=\"[hasHeader ? '' : 'pt-6']\">\n      <ElementRenderer :element=\"element\" :item=\"item\" />\n    </CardContent>\n  </Card>\n  <ElementRenderer\n    v-else-if=\"element\"\n    :element=\"element\"\n    :item=\"item\"\n  />\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;EAwCA,IAAM,IAAQ,GAKR,IAAa,QAAwB,EAAM,aAAa,EAAI,GAE5D,IAAY,QACV,EAAQ,EAAM,SAAU,EAAQ,EAAM,QAC9C;mBAIc,EAAA,SAAc,EAAA,WAAA,EAAA,GAA1B,EAUO,EAAA,CAAA,GAAA;;GAV4B,OAAM;;oBAM1B,CALK,EAAA,SAAA,EAAA,GAAlB,EAKa,EAAA,CAAA,GAAA,EAAA,KAAA,EAAA,GAAA;qBAJoC,CAA9B,EAAA,SAAA,EAAA,GAAjB,EAA+C,EAAA,CAAA,GAAA,EAAA,KAAA,EAAA,GAAA;sBAAZ,CAAA,EAAA,EAAR,EAAA,KAAK,GAAA,CAAA,CAAA,CAAA;;qBACT,EAAA,YAAA,EAAA,GAAvB,EAEkB,EAAA,CAAA,GAAA,EAAA,KAAA,EAAA,GAAA;sBADF,CAAA,EAAA,EAAX,EAAA,QAAQ,GAAA,CAAA,CAAA,CAAA;;;;oBAGf,EAEc,EAAA,CAAA,GAAA,EAFA,OAAK,EAAA,CAAG,EAAA,QAAS,KAAA,MAAA,CAAA,EAAA,GAAA;qBACsB,CAAnD,EAAmD,GAAA;KAAjC,SAAS,EAAA;KAAU,MAAM,EAAA;;;;;QAIlC,EAAA,WAAA,EAAA,GADb,EAIE,GAAA;;GAFC,SAAS,EAAA;GACT,MAAM,EAAA"}

package/dist/components/compositions/cards/ElementListCard.js

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