Faded placeholder rows on the empty lists

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.

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")
 					}, {

resources/js/components/TaskList.vue

@@ -416,6 +416,7 @@ defineExpose({ openCreate, refresh })
 
     <BaseEmptyPlaceholder
       v-show="showEmptyScreen"
+      :ghost="6"
       :title="t('tasks_projects.tasks.empty_title')"
       :description="t('tasks_projects.tasks.empty_description')"
     >

resources/js/pages/ProjectsIndexPage.vue

@@ -321,6 +321,7 @@ function statusLabel(status: ProjectStatus): string {
 
     <BaseEmptyPlaceholder
       v-show="showEmptyScreen"
+      :ghost="5"
       :title="t('tasks_projects.projects.empty_title')"
       :description="t('tasks_projects.projects.empty_description')"
     >

resources/js/pages/ReportsPage.vue

@@ -294,6 +294,7 @@ function clearRange(): void {
 
     <BaseEmptyPlaceholder
       v-else-if="!hasData"
+      :ghost="4"
       :title="t('tasks_projects.reports.empty_title')"
       :description="t('tasks_projects.reports.empty_description')"
     >

resources/js/pages/UnbilledTimePage.vue

@@ -353,6 +353,7 @@ async function createInvoice(): Promise<void> {
 
       <BaseEmptyPlaceholder
         v-else
+        :ghost="3"
         :title="t('tasks_projects.billing.customer.empty_title')"
         :description="t('tasks_projects.billing.customer.empty_description')"
       >
@@ -523,6 +524,7 @@ async function createInvoice(): Promise<void> {
 
       <BaseEmptyPlaceholder
         v-else
+        :ghost="5"
         :title="t('tasks_projects.billing.entries.empty_title')"
         :description="t('tasks_projects.billing.entries.empty_description')"
       >