|
| 1 | +{% import 'components/macros.twig' as components %} |
1 | 2 | {% set show_actions = hide_actions is not defined or hide_actions == false %} |
2 | | -{% macro render_tree(items, level=0, show_actions, view_key) %} |
| 3 | + |
| 4 | +{% macro render_tree(items, level=0, show_actions, view_key, components) %} |
3 | 5 | {% for key, item in items %} |
4 | 6 | {% if item.type == 'folder' %} |
5 | 7 | <div class="border-t border-gray-200 dark:border-gray-700" style="--level: {{ level }}"> |
|
11 | 13 | <span class="items-count text-gray-500 dark:text-gray-400 text-xs">({{ item.count }})</span> |
12 | 14 | </div> |
13 | 15 | <div class="tree-children hidden" data-path="{{ item.path }}"> |
14 | | - {{ _self.render_tree(item.children, level + 1, show_actions, view_key) }} |
| 16 | + {{ _self.render_tree(item.children, level + 1, show_actions, view_key, components) }} |
15 | 17 | </div> |
16 | 18 | </div> |
17 | 19 | {% else %} |
18 | 20 | <div class="keywrapper border-t border-gray-200 dark:border-gray-700" style="--level: {{ level }}"> |
19 | 21 | <div data-key="{{ item.base64 ? item.key|base64 : item.key }}" class="flex justify-between px-6 py-1 hover:bg-gray-50 dark:hover:bg-white/5" style="padding-left: calc({{ level }} * 20px + 32px)"> |
20 | 22 | <div class="flex items-center gap-2"> |
21 | 23 | {% if show_actions %} |
22 | | - {{ include('components/checkbox.twig', {class: 'check-key mt-0'}) }} |
| 24 | + {{ components.checkbox('check-key mt-0') }} |
23 | 25 | {% endif %} |
24 | 26 |
|
25 | 27 | <span class="text-primary-500 hover:text-primary-700 font-semibold dark:text-primary-400 dark:hover:text-primary-300"> |
|
33 | 35 | <div class="flex gap-4"> |
34 | 36 | {% for item_key, kitem in item.info %} |
35 | 37 | {% if item_key == 'type' %} |
36 | | - {% import 'partials/key_type_badge.twig' as key_badge %} |
37 | | - {{- key_badge.key_type(kitem) -}} |
| 38 | + {{- components.key_type(kitem) -}} |
38 | 39 | {% elseif item_key starts with 'number_' %} |
39 | 40 | {{- kitem|number -}} |
40 | 41 | {% elseif item_key starts with 'time_' %} |
|
62 | 63 |
|
63 | 64 | <div class="treeview border-b border-t border-gray-200 dark:border-gray-700"> |
64 | 65 | <div class="flex gap-2 px-6 py-2"> |
65 | | - <div title="Check all">{{ include('components/checkbox.twig', {disabled: keys|length == 0, class: 'check-all'}) }}</div> |
| 66 | + <div title="Check all">{{ components.checkbox('check-all', keys|length == 0) }}</div> |
66 | 67 | <button class="expand-toggle text-xs px-2 py-1 rounded text-gray-900 bg-gray-100 hover:bg-gray-300 dark:text-gray-100 dark:bg-gray-900 dark:hover:bg-gray-700"> |
67 | 68 | Expand all |
68 | 69 | </button> |
69 | 70 | </div> |
70 | 71 | <div class="tree-content"> |
71 | | - {{ _self.render_tree(keys, 0, show_actions, view_key) }} |
| 72 | + {{ _self.render_tree(keys, 0, show_actions, view_key, components) }} |
72 | 73 | </div> |
73 | 74 | </div> |
0 commit comments