Виджет счетчика в Reflex-FRP

Question

Я пытаюсь сделать в Reflex виджет счетчика со следующими качествами:

1. Он имеет минимальное значение 0 - и нажатие "декремента" при 0 ничего не приводит.

2. (решено) Кнопка увеличения находится справа от кнопки уменьшения.

3. К нему применены стили Bulma CSS.

Это код, который у меня сейчас есть:

bodyElementIncrRounds :: ObeliskWidget js t route m => m ()
bodyElementIncrRounds = do
    -- el "h2" $ text "Using foldDyn with function application"
    evIncr <- button "Increment"
    evDecr <- button "Decrement"
    -- evReset <- button "Reset"
    dynNum <- foldDyn ($) (0 :: Int) $ leftmost [(+ 1) <$ evIncr, (+ (-1)) <$ evDecr]
    el "h3" $ display dynNum
    return ()

Вот каков результат:

Когда я пытаюсь поменять местами кнопки, переворачивая их на значения: (+ 1) <$ evIncr, (+ (-1)) <$ evDecr, это никак не влияет на расположение кнопок. (Т.е. инкремент остается слева.)

Когда я пытаюсь применить такой код Bulma:

bodyElementIncrRounds :: ObeliskWidget js t route m => m ()
bodyElementIncrRounds = do
    -- el "h2" $ text "Using foldDyn with function application"
    evIncr <- elAttr "button" ("class" =: "button") $ button "Increment"
    evDecr <- button "Decrement"
    -- evReset <- button "Reset"
    dynNum <- foldDyn ($) (0 :: Int) $ leftmost [(+ 1) <$ evIncr, (+ (-1)) <$ evDecr]
    el "h3" $ display dynNum
    return ()

Он по какой-то причине дублирует кнопку, а также помещает существующую (некрасивую) кнопку внутри виджета Bulma (редактирование: проблема дублирования была решена, но не проблема "кнопка внутри кнопки"):