Offcanvas Example

import com.fastscala.components.bootstrap5.helpers.BSHelpers.*
new BSAccordion(
  <span>User data</span> -> (implicit fsc =>
    idx => {
      import DefaultFSDemoBSForm7Renderers.*

      new Form7 {
        override def postSubmitForm()(implicit fsc: FSContext): Js = {
          BSModal5.verySimple("Created User", "Done")(modal =>
            implicit fsc => {
              <span><b>First Name:</b> {editing.firstName}</span><br/> ++
                <span><b>Last Name:</b> {editing.lastName}</span><br/> ++
                <span><b>Email:</b> {editing.email}</span><br/>
            }
          )
        }

        lazy val _provField: F7SelectField[Province] =
          new F7SelectField[Province](CitiesData.data.keys.toList.sortBy(_.no)).label("Province").rw(editing.province, editing.province = _).option2String(_.name)

        override lazy val rootField: F7Field = F7VerticalField()(
          F7ContainerField("row")(
            "col" -> new F7StringField().label("First Name").rw(editing.firstName, editing.firstName = _),
            "col" -> new F7StringField().label("Last Name").rw(editing.lastName, editing.lastName = _)
          ),
          new F7StringField().label("Email").rw(editing.email, editing.email = _).inputType("email"),
          new F7SubmitButtonField(implicit fsc => BSBtn().BtnPrimary.lbl("Create User").btn.d_block)
        )

        override def formRenderer: F7FormRenderer = DefaultFSDemoBSForm7Renderers.formRenderer
      }.render()
    }
  ),
  <span>Actions</span> -> (implicit fsc =>
    idx => {
      BSBtn().BtnPrimary.lbl("Delete User").btn
    }
  )
).render()