/ client_code / MultiSelectDropDown / form_template.yaml
form_template.yaml
 1  components:
 2  - event_bindings: {click: _toggle, hide: _close}
 3    layout_properties: {slot: default}
 4    name: _select_btn
 5    properties: {align: left, icon: 'fa:chevron-down', icon_align: right, role: ae-ms-btn, text: None Selected}
 6    type: Button
 7  container:
 8    event_bindings: {hide: _close}
 9    properties: {background: '', border: '', foreground: '', html: <div anvil-slot="default"></div>, role: null, tooltip: '', visible: true}
10    type: HtmlTemplate
11  custom_component: true
12  events:
13  - {default_event: true, description: when the selected values change, name: change}
14  - {default_event: true, description: when the dropdown menu is opened, name: opened}
15  - {default_event: true, description: when the dropdown menu is closed, name: closed}
16  - {description: when the dropdown is shown, name: show}
17  - {description: when the dropdown is hidden, name: hide}
18  is_package: true
19  properties:
20  - default_value: left
21    group: text
22    important: true
23    name: align
24    options: [left, center, right]
25    type: enum
26  - {default_value: null, description: 'If set at runtime can use a list of tuples, (str, value) pairs. Or a list of dicts with keys: ''key'', ''value'', ''icon'', ''title'', ''enabled''', important: true, name: items, type: 'text[]'}
27  - {default_value: None Selected, important: false, name: placeholder, type: string}
28  - {default_value: null, group: interaction, important: false, name: enable_filtering, type: boolean}
29  - {default_value: true, group: interaction, important: false, name: multiple, type: boolean}
30  - {default_value: true, designer_hint: enabled, group: interaction, important: true, name: enabled, type: boolean}
31  - {default_value: false, group: interaction, important: false, name: enable_select_all, type: boolean}
32  - {default_value: true, designer_hint: visible, group: appearance, important: true, name: visible, type: boolean}
33  - {\'fit\' resizes to the selected content: null, default_value: '', description: use css lengths. \'auto\' sets the width as wide as the largest option, group: appearance, name: width, type: string}
34  - default_value: small
35    group: layout
36    important: false
37    name: spacing_above
38    options: [none, small, medium, large]
39    type: enum
40  - default_value: small
41    group: layout
42    important: false
43    name: spacing_below
44    options: [none, small, medium, large]
45    type: enum
46  - {group: user data, important: false, name: tag, type: object}
47  - allow_binding_writeback: true
48    binding_writeback_events: [change]
49    default_binding_prop: true
50    default_value: null
51    important: true
52    name: selected
53    type: object