fix(select-tree): adjust tree node indentation and alignment logic

- Add level prop to track node hierarchy
- Fix indentation calculation for leaves and nodes
- Simplify alignment logic based on node level

app/components/pub/base/select-tree/tree-view.vue

@@ -7,6 +7,7 @@ const props = defineProps<{
   data: TreeItem[]
   selectedValue?: string
   onFetchChildren: (parentId: string) => Promise<void>
+  level?: number
 }>()
 
 const emit = defineEmits(['select'])
@@ -19,25 +20,34 @@ function handleSelect(value: string) {
 const hasAnyChildrenInLevel = computed(() => {
   return props.data.some(item => item.hasChildren)
 })
+
+// Computed untuk menentukan apakah perlu alignment berdasarkan level
+const shouldAlignLeaves = computed(() => {
+  // Di root level (level 0), selalu align leaf dengan tree nodes jika ada mixed content
+  // Di level lain, hanya align jika ada mixed content
+  const isRootLevel = (props.level || 0) === 0
+  const hasMixedContent = hasAnyChildrenInLevel.value && props.data.some(item => !item.hasChildren)
+
+  return isRootLevel ? hasAnyChildrenInLevel.value : hasMixedContent
+})
 </script>
 
 <template>
   <div class="tree-view min-w-max">
     <template v-for="item in data" :key="item.value">
-      <!-- Jika item memiliki children, gunakan TreeNode -->
       <TreeNode
         v-if="item.hasChildren"
         :item="item"
         :selected-value="selectedValue"
         :on-fetch-children="onFetchChildren"
+        :level="level || 0"
         @select="handleSelect"
       />
-      <!-- Jika item tidak memiliki children, gunakan Leaf -->
       <Leaf
         v-else
         :item="item"
         :selected-value="selectedValue"
-        :should-align="hasAnyChildrenInLevel"
+        :should-align="shouldAlignLeaves"
         @select="handleSelect"
       />
     </template>