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?

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?

I quite understand how to get a minimal example working via shadow-cljs