# Panel 7: Format template
# The Notion document on this panel can be found here: https://www.notion.so/Line-Chart-User-Input-Forms-16fcae16861d80369c88c6a8a56c5ae6?pvs=4#175cae16861d805c9232d4d1e6cdac19
- container:
    name: "formatTemplateAndPlaceholderSection"
    title: "Format and Placeholder Selection"
    style:
      backgroundColor: "#f5f5f5"
    content:

      - block:
          name: slideSetupBlock
          style:
            display: "flex"
            gap: "15px"
            width: "100%"
          content:
            - block:
                name: formatTemplateAndPlaceholderBlock
                content:
                  - formatTemplateSelection:
                      name: presentationDesign
                      title: Presentation Design
                      templateName: "Primary Template"
                      subtitle: Adds trading volume over time as a column chart to the secondary vertical axis
                style:
                  width: "50%"
                  backgroundColor: "#ffffff"
                  border: "2px solid #d9d9d9"
                  borderRadius: "20px"
                  padding: "10px 20px"

            - block:
                name: placeholderSectionBlock
                style:
                  display: "flex"
                  flexDirection: "column"
                  width: "50%"
                  backgroundColor: "#ffffff"
                  border: "2px solid #d9d9d9"
                  borderRadius: "20px"
                  padding: "10px 20px"

                content:
                  - block:
                      name: placeholderSelectionContentWrapper
                      style:
                        display: "flex"
                        flexDirection: "column"
                        gap: "20px"
                        height: "100%"
                        width: "100%"
                      content:  
                        - block:
                            name: placeholderSelectionHeading
                            style:
                              display: "flex"
                              justifyContent: "center"
                              width: "100%"

                            content:
                              - divider:
                                  name: placeholderSection
                                  title: Placeholder Selection
                                  type: primary
                                  style:
                                    padding: "0px 0 15px 0"
                                    marginBottom: "4px"

                        - block:
                            name: placeholderSelectionContent
                            style:
                              display: "flex"
                              flexDirection: "column"
                              justifyContent: "center"
                              width: "100%"
                            content:  
                              - text:
                                  name: someText
                                  text: >
                                      <p>Select placeholder where you want the chart to go:</p>
                                  style:
                                    textAlign: "center"

                              - inlineGrid:
                                  style:
                                    justifyContent: "center"
                                    alignItems: "center"
                                    width: "100%"
                                    paddingBottom: "25px"
                                  content:
                                    - field:
                                        name: placeholderSelectionName
                                        type: string
                                        maxLength: 32
                                        readonly: true
                                        title:
                                        style:
                                          marginBottom: "0px"
                                          width: "330px"

                                    - iconButton:
                                        name: placeholderSelectionButton
                                        iconType: DownloadOutlined      
      
      # - block:
      #     name: placeholderSectionAndSourceNotesBlock
      #     style:
      #       display: "flex"
      #       flexDirection: "row-reverse"
      #       gap: "15px"
      #     content:
      #       - block:
      #           name: placeholderTitleBlock
      #           style:
      #             backgroundColor: "#ffffff"
      #             border: "2px solid #d9d9d9"
      #             borderRadius: "20px"
      #             width: "60%"
      #             padding: "10px 20px"
      #             marginTop: "15px"
      #             marginBottom: "7px"
      #           content:
      #             - divider:
      #                 name: placeholderTitleSection
      #                 title: Placeholder Title
      #                 type: primary
      #                 style:
      #                   padding: "0px 0 0 0"

      #             - checkboxField: 
      #                 name: placeholderTitleField
      #                 dataIndex: placeholderTitle
      #                 label: Add Title
      #                 placeholder: Enter placeholder title...
      #                 inputWidth: 400
      #                 titleWidth: "120px"
      #                 style:
      #                   marginTop: "-5px"

      #             - checkboxField: 
      #                 name: placeholderSubTitleField
      #                 dataIndex: placeholderSubTitle
      #                 label: Add Sub Title
      #                 placeholder: Enter placeholder sub title...
      #                 inputWidth: 400
      #                 titleWidth: "120px"
      #                 text: >
      #                   <p>If, between the placeholder title and placeholder, we identify insufficient space for sub-title inclusion, we will add the information as a footnote.</p>
      #                 style:
      #                   marginTop: "-10px"
                
              
            
            
                

      # - block:
      #     name: placeholderSourceNotesBlock
      #     style:
      #       display: "flex"
      #       flexDirection: "column"
      #       width: "100%"
      #       backgroundColor: "#ffffff"
      #       border: "2px solid #d9d9d9"
      #       borderRadius: "20px"
      #       padding: "10px 20px"
      #       marginTop: "15px"
      #       marginBottom: "7px"
      #     content:
      #       - divider:
      #           name: placeholderSourceNotesSection
      #           title: Source and Notes
      #           type: primary
      #           style:
      #             padding: "0px 0 0 0"
      #             marginBottom: "4px"
            
      #       - uiNotesSourceHeader:
      #           name: placeholderSourceNotesHeader
      #           title: "Positioning:"
      #           leftSpace: "460px"
      #           titleWidth: "200px"
      #           subtitle1: "Alpha Agent"
      #           subtitle2: "Below Placeholder"
      #           text: > 
      #             <p>We have two positioning approaches for Sources and Notes that come associated with your content. They are as follows:</p> <p><strong>Alpha Agent:</strong> We assess your current slide where we are adding the new placeholder and add additional Source / Note references as we deem most appropriate for your template structure and current slide.</p> <p><strong>Below the Placeholder:</strong> The Source / Note is added below the placeholder where the content is being added</p>
      #           style:
      #             marginTop: "4px"

      #       # Workflow OW2. Link to backend of previously provided companies / indicies / custom indices
      #       - inlineGrid:
      #           content:
      #             - checkboxField: 
      #                 name: formatTemplateSourceField
      #                 dataIndex: formatTemplateSource
      #                 label: Source
      #                 placeholder: Enter source...
      #                 inputWidth: 300
      #                 titleWidth: "60px"
      #                 style:
      #                   marginTop: "-5px"
      #                   marginBottom: "0px"  
      #             - binaryRadio:
      #                 name: positioningChoiceSource
      #                 dataIndex: positioningChoiceSource
      #                 option1Value: Alpha Agent
      #                 option2Value: Below Placeholder
      #                 activeColor: "#f59e0b" 
      #                 sectionWidth: "200px"
      #                 style:
      #                   marginLeft: "40px" 
      #           style:
      #             display: "flex"
      #             alignItems: "center" 
      #             marginTop: "4px" 


      #       - inlineGrid:
      #           content:
      #             - checkboxField: 
      #                 name: formatTemplateNotesField
      #                 dataIndex: formatTemplateNotes
      #                 label: Notes
      #                 placeholder: Enter notes...
      #                 inputWidth: 300
      #                 titleWidth: "60px"
      #                 fieldType: "textArea"
      #                 style:
      #                   marginTop: "10px"
      #                   marginBottom: "0px"
      #             - binaryRadio:
      #                 name: positioningChoiceNotes
      #                 dataIndex: positioningChoiceNotes
      #                 option1Value: Alpha Agent
      #                 option2Value: Below Placeholder
      #                 activeColor: "#f59e0b" 
      #                 sectionWidth: "200px"
      #                 style:
      #                   marginLeft: "40px" 
      #           style:
      #             display: "flex"
      #             alignItems: "center" 
      #             marginTop: "4px"