Tree select

Tree select digunakan untuk memilih item dari pilihan yang bertingkat, misalnya kategori tiket helpdesk: Hardware › Laptop › Battery. Pengguna membuka pohon, mencari, lalu memilih. Yang disimpan hanya key item, bukan jalurnya. Komponen ini ada di grup Select pada palette.

Mapping ke Engine

Bila belum memilih, nilai yang dikirim adalah "". Dengan Allow several items, nilai kosong adalah [].

Properties

• Name: Label komponen yang ditampilkan ke pengguna. Mendukung dua bahasa (EN & ID).
• Key: Mengikat komponen ke process variable yang menyimpan nilainya saat form disubmit. Default problem_category. Key yang berisi spasi atau sudah dipakai field lain membuat Save Changes nonaktif.
• Items: Pohon pilihan, maksimal 4 tingkat. Palette memulai dengan 16 item dalam 3 tingkat. Klik item untuk membuka panelnya:
  • Nama EN dan ID item. Key item dibuat dari nama EN dan unik di seluruh pohon. Bila nama itu sudah dipakai, key induk ditaruh di depan. Contoh: "Other" pertama menjadi other, "Other" berikutnya di bawah Access menjadi access_other.
  • Add child (nonaktif di tingkat 4), Add sibling, Move up, Move down, Move out, Move in, dan Delete. Menghapus item yang punya anak meminta konfirmasi lebih dulu.
  • Add top-level item menambah item di tingkat 1.
  • Keyboard di daftar: ↑ ↓ pindah item, → ← buka dan tutup, Enter mengganti nama, Alt/Option + ↑ ↓ mengubah urutan, Alt/Option + → ← memindah item naik atau turun satu tingkat.
  • Galat yang membuat Save Changes nonaktif: "Every item needs an English name", "Add at least one item", dan "Two items share the key …".
• Can be picked:
  • Last level only: hanya item tingkat terakhir yang bisa dipilih. Induk hanya membuka dan menutup.
  • Any level: induk juga bisa dipilih.
• Allow several items: Menyimpan daftar key, bukan satu key. Mencentang induk tidak ikut mencentang anaknya. Tipe nilai berubah menjadi list.
• Search box: Menampilkan kotak cari di atas pohon.
• Show the full path: Menampilkan jalur lengkap, misalnya "Hardware › Laptop › Battery", bukan hanya "Battery".
• Tooltip: Teks bantuan singkat yang muncul saat kursor diarahkan ke ikon informasi; diaktifkan lewat toggle.
• Disabled: Menonaktifkan komponen sehingga nilainya hanya bisa dibaca dan tidak dapat diisi.
• Hide If: Ekspresi FEEL untuk menyembunyikan komponen. Komponen disembunyikan ketika ekspresi bernilai true, dievaluasi ulang saat nilai field lain berubah.
• Validation:
  • Required: Komponen wajib diisi sebelum form disubmit.

Di kanvas builder, komponen tampil sebagai kotak "Select…" dengan ringkasan pohon, misalnya "16 items in 3 levels · last level only".

Perilaku saat diisi

• Klik kotak untuk membuka pohon. Cabang tingkat 1 sudah terbuka.
• Kotak cari mencocokkan nama EN dan ID. Induk setiap hasil tetap tampil, dan bagian yang cocok ditebalkan. Mengetik huruf saat fokus di pohon langsung masuk ke pencarian.
• Keyboard di pohon: ↑ ↓ pindah item, → membuka cabang lalu masuk ke anaknya, ← menutup cabang atau kembali ke induk, Enter atau Spasi memilih, Escape menutup pohon.
• Dengan Allow several items, setiap item punya kotak centang dan pilihan tampil sebagai chip dengan ×. Bila batas jumlah pilihan tercapai, item lain nonaktif.
• Pesan validasi: "<Name> is required" bila Required aktif dan belum memilih, misalnya "Problem category is required". Task tidak bisa diselesaikan sebelum diisi.
• Bila Disabled aktif, jalur item terpilih tetap terlihat dan tidak bisa diubah.
• Nilai ikut tersimpan di draft, tampil lagi saat task dibuka ulang, dan History menampilkan key yang tersimpan.
• Form start publik ikut mengirim nilainya dengan format yang sama.