feat(division): wip tree select component

feat(division): update division list components and add mock api

- Replace patient API endpoint with division mock endpoint
- Simplify table columns and headers for division list
- Add mock API endpoint for division list with tree/flat format

feat(select-tree): add collapsible tree select component with lazy loading

Implement a tree select component with collapsible sections and lazy loading of child items. Includes:
- Collapsible component wrappers for Vue
- Command component wrappers for combobox functionality
- Tree select item component with loading states
- Example implementation in dev page

todo:
- scroll on overflow
- long text truncate possibly with tooltip
- more than > 5 depth of child
- mutate the children lazy
- integration backend for search based text and return  keys

feat(select-tree): add command-item component for tree selection

adjust hover bg-accent (remove state on-highlighted at styling) to avoid conflict on global component

refactor(select-tree): extract TreeItem interface to shared type file

Move TreeItem interface to a dedicated type file for better code organization and reusability. Update components to import the interface and add styling improvements to the tree-select component.

adjust text size for tree to sm

refactor(select-tree): rename tree-select-item to leaf and improve component

- Rename component to better reflect its purpose as a leaf node
- Improve UI with better spacing and hover states
- Simplify toggle logic using v-model
- Add checkmark icon for selected items

checkpoint

wip

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

@@ -0,0 +1,45 @@
+<script setup lang="ts">
+import type { TreeItem } from './type'
+import Leaf from './leaf.vue'
+import TreeNode from './tree-node.vue'
+
+const props = defineProps<{
+  data: TreeItem[]
+  selectedValue?: string
+  onFetchChildren: (parentId: string) => Promise<void>
+}>()
+
+const emit = defineEmits(['select'])
+
+function handleSelect(value: string) {
+  emit('select', value)
+}
+
+// Computed untuk mendeteksi apakah ada node dengan children dalam level ini
+const hasAnyChildrenInLevel = computed(() => {
+  return props.data.some(item => item.hasChildren)
+})
+</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"
+        @select="handleSelect"
+      />
+      <!-- Jika item tidak memiliki children, gunakan Leaf -->
+      <Leaf
+        v-else
+        :item="item"
+        :selected-value="selectedValue"
+        :should-align="hasAnyChildrenInLevel"
+        @select="handleSelect"
+      />
+    </template>
+  </div>
+</template>