view1.m_right |=| view2.m_left - 12.0

addConstraint(NSLayoutConstraint(
    item:        view1,
    attribute:  .right,
    relatedBy:  .equal,
    toItem:      view2,
    attribute:  .left,
    multiplier:  1.0,
    constant:   -12.0
))

/* Set the size of three views at once */
[view1, view2, view3].m_size |=| (100, 200)

/* Pin a 200px high, same-width view at the bottom of a container */
[view.m_sides, view.m_bottom, view.m_height] |=| [container, container, 200]

/* VFL syntax */
view1 |>> viewA || viewB[==44] | 20 | viewC[~~2]

.package(url: "https://github.com/jmfieldman/Mortar.git", from: "2.0.0")

view1.m_width |=| 40                // Equal
view1.m_width |>| view2.m_width     // Greater than or equal
view1.m_size  |<| (100, 100)        // Less than or equal

view1.m_edges |=| view2.m_edges     // These two lines
view1         |=| view2             // are equivalent.

view1.m_top   |>| view2             // These two lines
view1         |>| view2.m_top       // are equivalent.

view1.m_top   |<| view2.m_bottom

// Super useful when trying to position views inside a navigation/tab controller!
view1.m_top   |<| self.m_safeTop

// Center a view inside the safe region of a UIViewController that is a child of
// a navigation controller or tab controller
textField.m_center |=| self.m_safeRegion

view1.m_size  |=| view2.m_size  * 2         // Multiplier
view1.m_left  |>| view2.m_right + 20        // Constant
view1         |<| view2.m_top   * 1.4 + 20  // Both -- m_top is implied on the left

view1.m_width |=| 100                // Single-dimension constants
view1.m_size  |=| 150.0              // Set multiple dimensions to the same constant
view1.m_size  |>| (200, 50)          // Set multiple dimensions to a tuple value
view1.m_frame |<| (0, 0, 50, 100)    // Four-dimension tuples supported

view1.m_size  |=| view2.m_size + (50, 30)
view1.m_size  |>| view2.m_size * (2, 3) + (10, 10)

view1         |=| view2.m_edges ~ (20, 20, 20, 20)  // view1 is inset by 20 points on each side

view1.m_size  |=| (view2.m_width, 100)

view1 |=| [view2.m_top, view3.m_bottom, view4.m_size]

/* Is equivalent to: */
view1 |=| view2.m_top
view1 |=| view3.m_bottom
view1 |=| view4.m_size

[view1, view2, view3].m_size |=| (100, 200)

/* Is equivalent to: */
[view1.m_size, view2.m_size, view3.m_size] |=| (100, 200)

/* Is equivalent to: */
view1.m_size |=| (100, 200)
view2.m_size |=| (100, 200)
view3.m_size |=| (100, 200)

[view1, view2, view3].m_centerY |=| otherView
[view1, view2, view3].m_height  |=| otherView

[view1.m_left, view2, view3] |=| [view4.m_right, view5, view6]

/* Is equivalent to: */
view1.m_left |=| view4.m_right
view2        |=| view5
view3        |=| view6

[view.m_sides, view.m_bottom, view.m_height] |=| [container, container, 200]

v0 |=| self.container.m_height
v1 |=| self.container.m_height ! .low
v2 |=| self.container.m_height ! .medium
v3 |=| self.container.m_height ! .high
v4 |=| self.container.m_height ! .required
v5 |=| self.container.m_height ! 300

view1        |=| [view2.m_caps   ! .high, view2.m_sides      ! .low]  // Inside array
view1.m_size |=| (view2.m_height ! .high, view2.m_width + 20 ! .low)  // Inside tuple

MortarDefault.priority.set(base: .medium)

MortarDefault.priority.push(.low)

v1 |=| v2 // Given priority .low automatically
...

MortarDefault.priority.pop()

let c = view1 |=| view2 ! .low     // Creates 4 low-priority constraints (1 per edge)
c.changePriority(to: .high)        // Sets all 4 constraints to high priority

let constraint = view1 |=| view2 ~~ .deactivated

// Later on, it makes more semantic sense to call .activate():
constraint.activate()

// Even though this is functionally equivalent:
constraint ~~ .activated

// It works with groups too:
let group = [
    view1 |=| view2
    view3 |=| view4
] ~~ .deactivated

let constraint = view1.m_top |=| view2.m_bottom

let mortarConstraint = view1.m_top |=| view2.m_bottom
for rawLayoutConstraint in mortarConstraint.layoutConstraints {
    ...
}

let group = [
    view1.m_origin |=| view2,
    view1.m_size   |=| (100, 100)
]

public typealias MortarGroup = [MortarConstraint]

let constraint = view1.m_top |=| view2.m_bottom

constraint.activate()
constraint.deactivate()

let group = [
    view1.m_origin |=| view2,
    view1.m_size   |=| (100, 100)
]

group.activate()
group.deactivate()

let constraint1 = view1.m_sides |=| view2
let constraint2 = view1.m_width |=| view2 ~~ .deactivated

constraint1.replace(with: constraint2)

let group1 = [
    view1.m_sides |<| view2,
    view1.m_caps  |>| view2,
]

let group2 = [
    view1.m_width |=| view2
] ~~ .deactivated

group1.replace(with: group2)

// Set both horizontal and vertical compression resistance priority simultaneously:
view1.m_compResist = 1

// Set horizontal and vertical compression resistance independently:
view1.m_compResistH = 300
view1.m_compResistV = 800

// Set both horizontal and vertical content hugging priority simultaneously:
view1.m_hugging = 1

// Set horizontal and vertical content hugging independently:
view1.m_huggingH = 300
view1.m_huggingV = 800

// These getters are fine:
let c1 = view1.m_compResistH
let c2 = view1.m_compResistV
let h1 = view1.m_huggingH
let h2 = view1.m_huggingV

// These getters raise exceptions:
let cr = view1.m_compResist
let hg = view1.m_hugging

viewA | viewB[==viewA] || viewC[==40] | 30 | viewD[~~1] | ~~1 | viewE[~~2]

// viewA has a size determinde by its intrinsic content size
// viewA is separated from viewB by 0 points (| operator)
// viewB has a size equal to viewA
// viewB is separated from viewC by the default padding (8 points; || operator)
// viewC has a fixed size of 40
// viewC is separated from viewD by a space of 30 points
// viewD has a weighted size of 1
// viewD is separated fom viewE by a weighted space of 1
// viewE has a weighted size of 2

viewA || [viewB, viewC, viewD][==40] || viewE

// viewB and viewC will take equal width between the
// right edge of viewA and the left edge of viewD
viewA.m_right |> viewB[~~1] | viewC[~~1] <| viewD.m_left

// viewB and viewC will be equal width between the
// left/right edges of viewA, inset by 8pt padding
// and separated by 40pts.
viewA ||>> viewB[~~1] | 40 | viewC[~~1]

// viewB and viewC will take equal height between the
// bottom edge of viewA and the top edge of viewD
viewA.m_bottom |^ viewB[~~1] | viewC[~~1] ^| viewD.m_top

// These are equivalent:
viewA.m_left |> viewB | viewC <| viewD.m_right
viewA        |> viewB | viewC <| viewD

// These are equivalent:
viewA.m_top  |^ viewB | viewC ^| viewD.m_bottom
viewA        |^ viewB | viewC ^| viewD

// viewB and viewc will be equal width between the
// left/right edges of viewA, inset by 8pt padding
// and separated by 40pts.
viewA ||>> viewB[~~1] | 40 | viewC[~~1]

// viewB will be twice as tall as viewC; both will be between
// the top/bottom edges of viewA.
viewA |^^ viewB[~~2] | viewC[~~1]

// Using m_visibleRegion is helpful for layouts in child view controllers
// to get views laid out inside the visible region, not under nav/tab bars
self.m_visibleRegion ||^^ viewA | viewB | viewC

// viewB will be placed at the right edge of viewA and be 44pts wide.
// viewC will be placed 8pts (padding) right of viewB and will be 88pts wide.
viewA.m_right |> viewB[==44] || viewC[==88]

// viewC will be placed at the left edge of viewA and be 88pts wide.
// viewB will be placed 8pts (padding) left of viewC and will be 44pts wide.
viewB[==44] || viewC[==88] <! viewA.m_left

// viewB will be placed at the bottom edge of viewA and be 44pts high.
// viewC will be placed 8pts below viewB and respect its intrinsic content height.
viewA.m_bottom |^ viewB[==44] || viewC

// viewC will be placed at the top edge of viewA and be 88pts high.
// viewB will be placed 8pts above viewC and will be 44pts high.
viewB[==44] || viewC[==88] ^! viewA.m_top

self.view.addSubview(backgroundView)
self.view.addSubview(myCoolPanel)
myCoolPanel.addSubview(nameLabel)
myCoolPanel.addSubview(nameField)

    self.view |+| [
        backgroundView,
        myCoolPanel |+| [
            nameLabel,
            nameField
        ]
    ]

    self.view |^| [
        myCoolPanel |^| [      // myCoolPanel is added second and
            nameField,         // is therefore on top of backgroundView
            nameLabel
        ],
        backgroundView
    ]

class MyController: UIViewController {

    // Instantiation/configuration
    let myLabel = UILabel.create {
        $0.text          = "Some Text"
        $0.textAlignment = .center
        $0.textColor     = .red
    }

    // UIViews can use the immediate init block
    let myButton = UIButton {
        $0.setTitle("Hello", for: .normal)
    }

    override func viewDidLoad() {
        super.viewDidLoad()

        // Hierarchy
        self.view |+| [
            myLabel,
            myButton
        ]

        // Layout
        myLabel.m_top     |=| self.view
        myLabel.m_centerX |=| self.view
        myButton.m_width  |=| myLabel
    }
}

view1 |+| [
    UILabel.create {
        // Crash here, because the newly created UILabel is not
        // a subview of view1 until *after* the top-level |+| is
        // executed.
        $0.m_width |=| view1
    }
]

view1 |+| [
    UILabel.create {
        // This is OK in Mortar 2.0.0; the constraint will not
        // activate until after the outer-most |+| executes.
        $0.m_width |=| view1
    }
]

view |+| { view in
    UIStackView {
        $0.spacing = 1
        $0.axis = .vertical
        $0.m_width |=| view
    } |+| { stack in
        UILabel {
            $0.text = viewModel.helloText
            $0.m_height |=| stack
        }
        UILabel {
            $0.text = "World"
            $0.m_height |=| stack
            $0.reactive.text <~ viewModel.worldText
        }
        UIButton {
            $0.reactive.pressed = viewModel.pressed
        }
    }
]