Clojurians Log v2

Anyone with styled experience might know why this doesn't want to work?

(defstyled delete-button 
  :button
  {
    :color "white"
    :margin-left "1rem"
    :background-color "blue"
    :border-radius "4px"
    :border-style "none"
  })

[delete-button {:on-click (fn [] (println "hello"))} "Delete Me"]

;; Unknown event handler property `on-click`. It will be ignored.

try :onClick?

Lol, why did this work?

On another note, I'm trying to use specs to help enforce, at runtime, the prop types of my components. E.g.

(defn component [{:keys [title on-delete]}]
    [styled/root 
     [styled/details
      [:span title]
      [styled/delete-button {:onClick on-delete} "Delete Me"]]])

(s/fdef component
  :args (:props int?))

I still get a warning in my .cljs:

35 |         color-map (for [[i node] ^js (.. dag idescendants entries)]
----------------------------------------^---------------------------------------
 Cannot infer target type in expression (. dag idescendants)

wrong place for the hint. should be (.. ^js dag ...)

or better yet hint whereever dag is coming from, so (let [^js dag ...] ...) or (fn [^js dag] ...)

I've had problems with loading stuff in the correct order (wait for DOM element to render, then append a graph to the DOM element). I am able to see the SVG info shown below in my page source. However, nothing renders on screen. Might nothing showing still be due to me loading in the wrong order? Or, considering that the SVG info is in the page source is the problem likely to lie somewhere else?

One thing is different from the JS version source: in the JS version the SVG has a height and a width.. I also try to set a height and width in my code, but that obvs has changed nothing.

Too little info to give a useful answer. You should go through the nodes in the inspector and understand why the SVG is not visible. Then try to understand where the difference comes from.

I found it. I had misunderstood a JS API (it seemed to mutate an object in place, but it actually returned a slightly modified version). Thanks for looki_ng._

looks like you have a [:svg [:width [:height ...]]] which would be invalid

That too 😳 I used (.append "width" width), not (.attr "width" width)

might be that it doesn't show anything because of those invalid elements. not exactly sure how svg handles that

okay!