From 12725f8929d18089454592f03ed5eca0b1c97144 Mon Sep 17 00:00:00 2001 From: Darko Gjorgjijoski Date: Wed, 23 Sep 2026 16:47:30 +0200 Subject: [PATCH] feat: faded placeholder rows on the empty lists The host's empty lists sit in a card of faded rows shaped like the table to come, through the placeholder's ghost prop (host 3.0.0-alpha.4). The module's tasks, projects, reports and unbilled time lists now ask for the same, sized to their own columns, so they match the host's pages. An older host doesn't know the prop and draws the empty state as before, so AGENTS.md now allows a newer prop when a host that ignores it still renders correctly. --- AGENTS.md | 8 +++++--- dist/init.js | 5 +++++ resources/js/components/TaskList.vue | 1 + resources/js/pages/ProjectsIndexPage.vue | 1 + resources/js/pages/ReportsPage.vue | 1 + resources/js/pages/UnbilledTimePage.vue | 2 ++ 6 files changed, 15 insertions(+), 3 deletions(-) diff --git a/AGENTS.md b/AGENTS.md index 79303e0..da32ffc 100644 --- a/AGENTS.md +++ b/AGENTS.md @@ -22,6 +22,8 @@ the InvoiceShelf 3.x `AGENTS.md` before making changes. - `composer.json` takes `invoiceshelf/modules` `^3.4` from the SDK's GitHub repository through a plain `vcs` entry. - The module must run on every host its `module.json` compatibility range admits, so it uses only - Base* components and props that exist on the oldest of them. Name icon-only controls with - `aria-label`, and write layout classes in their logical form (`ms-`, `pe-`, `start-`, - `text-end`) so right-to-left languages mirror; `pnpm run lint` checks accessibility. + Base* components and props that exist on the oldest of them. A newer prop is allowed only when + an older host that ignores it still renders correctly: the empty placeholder's `ghost` rows + (host 3.0.0-alpha.4) show on newer hosts and are simply absent on older ones. Name icon-only + controls with `aria-label`, and write layout classes in their logical form (`ms-`, `pe-`, + `start-`, `text-end`) so right-to-left languages mirror; `pnpm run lint` checks accessibility. diff --git a/dist/init.js b/dist/init.js index 3bf4c07..783a947 100644 --- a/dist/init.js +++ b/dist/init.js @@ -1356,6 +1356,7 @@ var dn = { class: "mt-2 text-sm text-muted" }, fn = { class: "flex flex-wrap ite o("p", Sn, [c(I, { amount: e.amount }, null, 8, ["amount"])]) ], 8, yn))), 128))])) : (v(), r(B, { key: 1, + ghost: 3, title: w(d)("tasks_projects.billing.customer.empty_title"), description: w(d)("tasks_projects.billing.customer.empty_description") }, { @@ -1443,6 +1444,7 @@ var dn = { class: "mt-2 text-sm text-muted" }, fn = { class: "flex flex-wrap ite }, 8, ["loading", "disabled"])])]) ], 64)) : (v(), r(B, { key: 2, + ghost: 5, title: w(d)("tasks_projects.billing.entries.empty_title"), description: w(d)("tasks_projects.billing.entries.empty_description") }, { @@ -2421,6 +2423,7 @@ var Dr = { class: "flex w-full items-center justify-between" }, Or = ["aria-labe _: 1 }, 8, ["show"]), O(c(B, { + ghost: 5, title: w(u)("tasks_projects.projects.empty_title"), description: w(u)("tasks_projects.projects.empty_description") }, { @@ -4109,6 +4112,7 @@ var q = { "can-invoice" ]), O(c(f, { + ghost: 6, title: w(g)("tasks_projects.tasks.empty_title"), description: w(g)("tasks_projects.tasks.empty_description") }, { @@ -5373,6 +5377,7 @@ var Es = { ]) ], 64)) : (v(), r(ae, { key: 1, + ghost: 4, title: w(u)("tasks_projects.reports.empty_title"), description: w(u)("tasks_projects.reports.empty_description") }, { diff --git a/resources/js/components/TaskList.vue b/resources/js/components/TaskList.vue index 5a29844..11d697d 100644 --- a/resources/js/components/TaskList.vue +++ b/resources/js/components/TaskList.vue @@ -416,6 +416,7 @@ defineExpose({ openCreate, refresh }) diff --git a/resources/js/pages/ProjectsIndexPage.vue b/resources/js/pages/ProjectsIndexPage.vue index 974dc17..74091be 100644 --- a/resources/js/pages/ProjectsIndexPage.vue +++ b/resources/js/pages/ProjectsIndexPage.vue @@ -321,6 +321,7 @@ function statusLabel(status: ProjectStatus): string { diff --git a/resources/js/pages/ReportsPage.vue b/resources/js/pages/ReportsPage.vue index 810e5ba..5bd8f66 100644 --- a/resources/js/pages/ReportsPage.vue +++ b/resources/js/pages/ReportsPage.vue @@ -294,6 +294,7 @@ function clearRange(): void { diff --git a/resources/js/pages/UnbilledTimePage.vue b/resources/js/pages/UnbilledTimePage.vue index 29b4066..2b32b81 100644 --- a/resources/js/pages/UnbilledTimePage.vue +++ b/resources/js/pages/UnbilledTimePage.vue @@ -353,6 +353,7 @@ async function createInvoice(): Promise { @@ -523,6 +524,7 @@ async function createInvoice(): Promise {