Sidebar Template

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
a!wizardLayout(
  titleBar: a!sidebarTemplate(
    title: "New License Application",
    secondaryText: "Complete this for to apply for a license, providing all required personal information.",
    backgroundColor: "ACCENT",
    image: a!documentImage(document: a!EXAMPLE_TITLE_BAR_IMAGE()),
    width: "MEDIUM",
    additionalContents: {
      {
        a!cardLayout(
          contents: {
            a!richTextDisplayField(
              labelPosition: "COLLAPSED",
              value: {
                a!richTextItem(
                  text: "Contact Info:",
                  style: "STRONG"
                ),
                char(10),
                a!richTextIcon(icon: "envelope"),
                a!richTextItem(
                  text: " support@company.com",
                  color: "#94B2C0",
                  link: a!safeLink(uri: "mailto:support@company.com")
                ),
                char(10),
                a!richTextIcon(icon: "phone"),
                " 555-123-4567"
              }
            )
          },
          style: "#141494",
          showBorder: false,
          showShadow: true
        )
      }
    }
  ),
  steps: {
    a!wizardStep(
      label: "Personal Information",
      contents: {
        a!columnsLayout(
          columns: {
            a!columnLayout(
              contents: { a!textField(label: "First Name") }
            ),
            a!columnLayout(
              contents: { a!textField(label: "Last Name") }
            )
          }
        ),
        a!textField(label: "Email")
      }
    ),
    a!wizardStep(
      label: "Address",
      contents: {
        a!textField(label: "Street Address"),
        a!columnsLayout(
          columns: {
            a!columnLayout(
              contents: { a!textField(label: "City") }
            ),
            a!columnLayout(
              contents: { a!textField(label: "State") }
            ),
            a!columnLayout(
              contents: { a!integerField(label: "Zip Code") }
            )
          }
        )
      }
    ),
    a!wizardStep(
      label: "Supporting Documents",
      instructions: "Upload supporting documents such as proof of address",
      contents: {
        a!fileUploadField(
          label: "File Upload",
          labelPosition: "COLLAPSED"
        )
      }
    )
  },
  primaryButtons: {
    a!buttonWidget(
      label: "Submit",
      style: "SOLID",
      showWhen: fv!isLastStep
    )
  },
  secondaryButtons: {
    a!buttonWidget(
      label: "Cancel",
      style: "LINK"
    )
  }
)