reagent 2022-07-08 | Slack Archive

is there any utility for converting a “tagless” hiccup keyword like :#foo.bar.baz to {:id "#foo" :class "bar baz"}

I have a custom component that controls the “tag” part, but I still want to use the hiccup format for passing id and classes

timothypratley20:07:21

cljs.user=> (.-id (reagent.impl.template/parse-tag :foo#bar.baz))
=> "bar"

cljs.user=> (.-className (reagent.impl.template/parse-tag :foo#bar.baz))
=> "baz"

cljs.user=> (cljs-bean.core/bean (reagent.impl.template/parse-tag :foo#bar.baz))
=> {:tag "foo", :id "bar", :className "baz", :custom false}

Something like this?

timothypratley20:07:24

If you want to make the tag optional you could achieve that with

(defn id-class [k]
  (let [[?tag id className] (->> k name (re-matches #"([^\s\.#]+)?(?:#([^\s\.#]+))?(?:\.([^\s#]+))?") next)]
    {:tag       ?tag
     :id        id
     :className (str/replace className #"\." " ")}))

(id-class :#foo.bar.baz)
=> {:tag nil, :id "foo", :className "bar baz"}

shaunlebron23:07:48

hey thanks! 🙏

😄 1

shaunlebron14:07:56

this is of course very easy to write— just wondering if people do this and if its builtin

p-himik16:07:08

Just my 5c - I'd write it as {:id :foo, :class [:bar :baz]}. This way, keyword search and editing would be fully available. I used to use such x#y.z shortcuts myself but eventually realized that it makes some things easy but less simple.

🙏 1

➕ 1

2022-07-08

Channels