From 8492391c79d96ae160d9521f2316b46cefa835b1 Mon Sep 17 00:00:00 2001
From: Tarek Hamaoui <tarek.hamaoui@digitalservice.bund.de>
Date: Wed, 23 Oct 2024 12:12:31 +0200
Subject: [PATCH] refactor(tree): simplify class handling

RISDEV-0000
---
 src/primevue/tree/tree.css | 17 -----------------
 src/primevue/tree/tree.ts  | 18 ++++--------------
 2 files changed, 4 insertions(+), 31 deletions(-)

diff --git a/src/primevue/tree/tree.css b/src/primevue/tree/tree.css
index 1f42c30..56a2b3e 100644
--- a/src/primevue/tree/tree.css
+++ b/src/primevue/tree/tree.css
@@ -1,20 +1,3 @@
-span[data-pc-section="nodelabel"]:has(a + span) {
-  @apply gap-4;
-}
-
-span[data-pc-section="nodelabel"] a,
-span[data-pc-section="nodelabel"] span {
-  @apply w-full focus:outline-none;
-}
-
-span[data-pc-section="nodelabel"] :first-child {
-  @apply group-hover:underline;
-}
-
-span[data-pc-section="nodelabel"] span:last-child {
-  @apply group-hover:no-underline;
-}
-
 div[data-pc-section="nodecontent"]:has(
     + ul[data-pc-section="nodechildren"]
       li
diff --git a/src/primevue/tree/tree.ts b/src/primevue/tree/tree.ts
index b544bc3..6d37540 100644
--- a/src/primevue/tree/tree.ts
+++ b/src/primevue/tree/tree.ts
@@ -3,13 +3,8 @@ import { tw } from "@/lib/tags.ts";
 import "./tree.css";
 
 const tree: TreePassThroughOptions = {
-  node: () => {
-    const focus = tw`focus-visible:outline-none focus-visible:outline-4 focus-visible:outline-offset-4 focus-visible:outline-blue-800`;
-    return {
-      class: {
-        [focus]: true,
-      },
-    };
+  node: {
+    class: tw`focus-visible:outline-none focus-visible:outline-4 focus-visible:outline-offset-4 focus-visible:outline-blue-800`,
   },
   nodeContent: ({ context }) => {
     const base = tw`group ris-label2-bold flex w-full gap-4 border-l-4 border-transparent py-10 pl-10 pr-20 text-blue-800 hover:bg-gray-100`;
@@ -49,13 +44,8 @@ const tree: TreePassThroughOptions = {
       },
     };
   },
-  nodeLabel: () => {
-    const base = tw`group flex w-full flex-col items-start outline-none group-hover:text-black`;
-    return {
-      class: {
-        [base]: true,
-      },
-    };
+  nodeLabel: {
+    class: tw`group flex w-full flex-col items-start outline-none *:w-full *:outline-none group-hover:text-black [&>*:first-child]:group-hover:underline [&>*:last-child]:group-hover:no-underline`,
   },
 };