girouette

https://github.com/green-coder/girouette
West 2021-04-12T09:54:09.013500Z

Is there any way to try to make girouette a drop-in replacement for tailwind? What I mean is, I'd like be able to write {:class (css ["inline-block" "underline"])} like {:class '[inline-block underline]}.

➕ 1
West 2021-04-13T07:12:16.017300Z

Well, I'm a little stumped, I gotta say. It was certainly fun refactoring the processor. I'm gonna sleep on this one and maybe I'll figure out how instaparse works.

2021-04-13T07:13:12.017500Z

Hi. The hiccup-tag-grammar is for parsing the keywords inside a hiccup structure. You probably don't need to touch it.

West 2021-04-13T07:32:07.017900Z

I see. So right now I'm trying to figure out where exactly the program takes in the strings. It seems like cljs.analyzer.api is the library in gather-css-classes that does the parsing. I found that it does something called passes after taking in the whole file. So each of these passes has some regex and destructuring for keywords and strings, it would seem that all I need to do is add some regex or something to take symbols in. That's where I'm stuck.

2021-04-13T07:34:36.018100Z

> Sorry, the analyzer is not so easy to use. Yes ..

West 2021-04-13T08:42:30.018300Z

I got it!!

West 2021-04-13T08:49:12.019Z

Now I just gotta get the regex to work right.

2021-04-13T08:49:36.019200Z

What regex?

West 2021-04-13T08:50:15.019400Z

(def receive-hook-fn
  {:keyword #(->> (name %)
                  (re-seq #"\.[^\.#]+")
                  (map (fn [s] (subs s 1))))
   :string  #(->> (str/split % #" ")
                  (remove str/blank?))
   :symbol  #(->> (name %)
                  (re-seq #"[\S]+"))})

West 2021-04-13T08:51:12.019600Z

I think this does it though, maybe there's a more elegant way to do that.

2021-04-13T08:51:33.019800Z

I may have time to take a look tonight.

West 2021-04-14T00:24:41.021Z

https://github.com/green-coder/girouette/pull/58

🎉 1
2021-04-14T03:00:56.021400Z

Merged. Thank you !

West 2021-04-14T03:43:11.021600Z

Excellent. I'll be working on some documentation.

West 2021-04-14T07:24:22.021800Z

I just realized that this processor will take in strings, keywords, and symbols, however it does so indiscriminately. I guess that's why there was so much red text after the processor did its thing. How did you test the analyzer so you could see the AST of whatever file was put in?

West 2021-04-14T08:08:04.022100Z

Nevermind, I got the hang of it. You were certainly right that it's difficult, but it's better than trying to use bean on Java classes and methods.

2021-04-14T10:08:59.022900Z

There are plans to rewrite the processor at some point, using rewrite-clj, so no need to spend too much time on it.

West 2021-04-14T10:25:20.023100Z

The whole reason I'm working on this is because I want to use it on my website. I really want to get this working properly.

2021-04-14T12:21:02.023300Z

The "false positives" you are getting when gathering the symbols should not stop you in your process. I wouldn't worry about it if I was you. In the worse case, some of the symbols will match the grammar used by Girouette and your CSS file will be slighly bigger .. you might not even feel it.

West 2021-04-14T23:36:33.023500Z

Awww damn, I think I introduced a bunch of bugs into the program with this change. Not only is it detecting false positives, but it's also detecting false negatives.

West 2021-04-14T23:37:23.023900Z

I think I'll just have to convert all my classes to strings after all.

2021-04-15T02:47:05.024100Z

Should I revert the commit?

West 2021-04-15T07:09:28.024300Z

Yeah, it's probably for the best. Sorry I didn't test more.

2021-04-12T10:24:59.013700Z

I think it is already the case, except that it currently takes strings and not symbols.

West 2021-04-12T10:25:25.013900Z

hmmmm, let me test

2021-04-12T10:25:51.014100Z

Take a look at the example project in the repository.

West 2021-04-12T10:31:06.014300Z

Alright, following the above example, it looks like I can do {class '["inline-block" "underline"]}.

West 2021-04-12T10:35:55.014500Z

So what's the most difficult part about making the tool consume symbols?

West 2021-04-12T10:37:32.014700Z

I'm looking through the codebase to find out what step the conversion happens.

2021-04-12T10:38:16.014900Z

It's not difficult to change. It's probably in the preprocessor project.

West 2021-04-12T11:20:57.015100Z

I found it, working on implementing it.

West 2021-04-12T13:50:03.015300Z

Perhaps you can point me in the right direction. I'm trying to get symbols to work, but I don't know what other steps in the chain I should look at. This is my progress so far. I also did a bit of refactoring as I saw fit, but feel free to ignore those changes if you think your way was more readable. https://github.com/wildwestrom/girouette/blob/develop/lib/processor/src/girouette/processor.clj

2021-04-12T13:58:48.015600Z

Sorry, the analyzer is not so easy to use.

2021-04-12T13:59:24.015800Z

I cannot look at it at the moment because I am still working.

2021-04-12T14:00:09.016Z

I noticed that keywords are supported. Would that work for you?

West 2021-04-12T14:02:39.016200Z

They do work, and under certain circumstances I'll use them, but I still want to make this work. I'll keep at it.

2021-04-12T14:04:24.016400Z

I think that I did not support symbols by design, thinking that string and keywords would be good enough.

2021-04-12T16:23:00.016600Z

+1 for symbols. it's a small thing, but imo it adds up

👌 1
West 2021-04-12T21:44:46.017100Z

Maybe I have to edit this function?

(def hiccup-tag-grammar "
  hiccup-tag = html-tag (<'#'> id | (<'.'> class-name))*
  html-tag = segment
  id = segment
  class-name = segment
  <segment> = #'[^\\.#]+'
  ")