How to do attributes with no value?

[NOBLES5E]

It seems the rendered html of

  [sa/Sidebar {:inverted true}]

gives

<div class="ui left sidebar"></div>

instead of

<div inverted class="ui left sidebar"></div>

[gadfly361]

@ikzk A couple of things to note:

1. The inverted option is not available to the Sidebar component by itself. If you see inverted as an option to a Sidebar component in the SemanticUIReact documentation ... that is only because they are using as something else (like a Menu ... where the Menu has access to the inverted option). So in your example, because you aren't using as something else ... you should see a runtime error in the console saying inverted is invalid.
2. When you add inverted to the options map, it will show up on the rendered html as a class (not as an attribute).

Here is an example of a working Sidebar:

(defn sidebar-example []
  (let [visible          (reagent/atom false)
        on-click-handler (fn []
                           (reset! visible (not @visible)))]
    (fn []
      [:div
       [sa/Button {:on-click on-click-handler} "Toggle"]
       [sa/SidebarPushable {:as (aget js/semanticUIReact "Segment")}
        [sa/Sidebar {:as        (aget js/semanticUIReact "Menu")
                     :animation "push"
                     :width     "thin"
                     :visible   @visible
                     :icon      "labeled"
                     :vertical  true
                     :inverted  true}
         [sa/MenuItem {:name "home"}
          [sa/Icon {:name "home"}]
          "Home"]]
        [sa/SidebarPusher
         [sa/Segment {:basic true}]
         [sa/Header "Application Content"]]]])))

And when visible, the rendered html looks like this:

<div class="ui segment pushable">
  <div class="ui inverted vertical labeled icon ui push left thin visible sidebar menu">
    <div class="item">
      <i aria-hidden="true" class="home icon">
      </i><!-- react-text: 8 -->Home<!-- /react-text -->
    </div>
  </div>
  <div class="pusher">
    <div class="ui basic segment">
    </div>
    <div class="ui header">
      Application Content
    </div>
  </div>
</div>

[NOBLES5E]

Thanks for your detailed reply!!