Clojurians Log v2

Hello all, I don´t understand how to use JS interop with cljs, look this:

import GridLayout from 'react-grid-layout';

class MyFirstGrid extends React.Component {
  render() {
    return (
      <GridLayout className="layout" cols={12} rowHeight={30} width={1200}>
        <div key="a" data-grid={{x: 0, y: 0, w: 1, h: 2, static: true}}>a</div>
        <div key="b" data-grid={{x: 1, y: 0, w: 3, h: 2, minW: 2, maxW: 4}}>b</div>
        <div key="c" data-grid={{x: 4, y: 0, w: 1, h: 2}}>c</div>
      </GridLayout>
    )
  }
}

(ns app.componentes.principal
  (:require
   [helix.core :refer [$]]
   [helix.dom :as d]
   [app.lib :refer [defnc]]
   ["react-grid-layout" :default GridLayout]))

(defnc Principal []
       ($ GridLayout {:className "layout"
                      :cols 12
                      :rowHeight 30
                      :width 1200}
          (d/div {:key "a"
                  :data-grid {:x 0 :y 0 :w 1 :h 2 :static true}} "a")
          (d/div {:key "b"
                  :data-grid {:x 1 :y 0 :w 3 :h 2 :minW 2 :maxW 4}} "b")
          (d/div {:key "c"
                  :data-grid {:x 4 :y 0 :w 1 :h 2}} "c")))

try changing your require to ["react-grid-layout" :as GridLayout]

it is because GridLayout is empty, which means your require is probably wrong

😅 Wrong documentation

it works with :as thing

created a pr to ease writing css class names in helix https://github.com/Lokeh/helix/pull/45

is there some specific reason why this channel is not logged on the https://clojurians-log.clojureverse.org/ ?

I am new around here : S

nope

I don’t know how to get #helix to participate in that

Zulip archives it though.

I am not familiar with Zulip, looks like a slack alternative?