zenario_edit_tuix_snippet: &definition
    css_class: zfea_edit_box
    fea_type: form
    key:
        id: ''
    title: 'Creating a new TUIX snippet'
    title_for_existing_records: 'Editing TUIX snippet [[id]] ([[name]])'
    error_on_form_message: Please check below for errors.
    tab: details
    tabs:
        details:
            notices:
                note_about_editing_html:
                    type: warning
                    show: true
                    message: >
                        This interface allows you to enter tags and attributes that could
                        potentially be used for cross-site scripting attacks (XSS) on this
                        site.
                        Please be sure that you understand what the code does, and do not
                        copy-paste code from third party sources that you don't trust!
            edit_mode:
                on: true
                enabled: true
            fields:
                last_updated:
                    type: text
                    show_as_a_span: true
                    hide_if_empty: true
                    row_class: zfea_form_row__last_edited
                desc:
                    snippet:
                        p: >
                            Use this to create a snippet of customised TUIX code that can be used to
                            modify the appearance and/or behaviour of a FEA plugin on this site.
                name:
                    label: 'Name:'
                    type: text
                    maxlength: 255
                    validation:
                        required: Please enter a name for your TUIX snippet
                
                insert_object:
                    same_row: true
                    visible_if: |
                        !_.isEmpty(field.values)
                    type: select
                    css_class: insert_objects iconselectmenu
                    empty_value: 'Insert object...'
                    values: {}
                    style: |
                        width: 400px;
                    onchange: |
                        lib.appendCodeEditorValue('custom_yaml', $(this).val());
                        $(this).val('').iconselectmenu('refresh');
                
                custom_yaml:
                    type: code_editor
                    language: yaml
                    #tall_as_possible: true
                    code_editor_options:
                        useSoftTabs: true
                    style: |
                        height: 40em;
                custom_json:
                    type: hidden
        
                submit:
                    type: button
                    value: Save
                    save_onchange: true
        
                save_and_continue:
                    same_row: true
                    visible_if: |
                        tuix.key.id
                    type: button
                    value: Save and continue
                    save_onchange: true

    confirm_on_close:
        visible_if: |
            lib.changed && lib.changed.details
        message: 'Are you sure you wish to abandon your changes?'
        button_message: Abandon
        cancel_button_message: Cancel
        message_type: warning

#Use the edit mode definition as the definition for create mode as well
zenario_create_tuix_snippet: *definition