elm-origami開発に関していろいろ
miyamomiyamoen/elm-origamiはrtfeldman/elm-cssをフォークして作られたCSS in Elm的なライブラリです
miyamo
css を複数適用する
styled-componentsかemotionのドキュメントに複数適用した場合どっちが優先されるかわからんよって書いてあった気がする
elm-cssでは複数適用した場合最初のが適用されてそれ以外は捨てられます。が、捨てられたほうもクラス名はつくため他のところで捨てられたstyleが適用されているとstyle tagに入ってることになるので適用されます。その場合どっちが優先されるかはわかりません。
1個しか付けれないよって規約でもいいんですが現状の実装はよろしくないですね。
elm-origamiでは複数適用できて優先はわからないという実装にしてます。そこら辺は作り直したので。
今後
一つしか適用できないようにするなら型をそういう感じにすべきかなって思います。
もしくは適用した順になるように内部でくっつけるようにするか……
miyamo型安全CSSについて
この文脈での型安全はCSSの構文を型付DSLで書けるようにして安全だねってするやつです。
「型安全にするため」という名目で独自のプロパティ名を逐一調べないといけません。
調べて使い方を理解しないといけないのだるい。
elm-cssは型安全CSSを目指して作り始めたっぽいのでそういう部分が大きいんですが、DSLを表現するためにextensible recordによるFantom Typeしててなかなか面倒です。文字列で書けばいいんじゃないかと思ってます。
あとCSSがたくさんあるせいで漏れ漏れな感じです。メンテする気はもうないと思います。
わたしはCSS in Elm的な部分だけあればいいと思ったので抜き出してきれいにしてorigamiを作った感じです。仕組みを後付してきれいにしてなかったので結構謎な感じだったんですよね。
miyamoCSSファイルを生成する
型安全CSSを目指して作られたっぽいelm-cssは以前はCSSファイルを生成してました。
その頃使ってないのであんまりわかんないんですけど。
その後、今のCSS in Elm的使用法だけに限定された感じです。
CSS生成部分を使いたいひと用にフォークしたパッケージもあった気がする
テスト用に何か生成する
それはともかく要素に適用されたstyleを吐き出すAPI作ったらテスト用に使えるかなってちょっと思ってる。
miyamoChakra
Chakraはemotionを使って作られたUIライブラリ？です。たぶん
ひとびと、結局よくできたコンポーネント集を求めているらしいのでそういうの作っといたらいいのかなって思ってる。
てーみんぐ
てーみんぐ機能があるんだけど結構使われるものらしい。そうなのか……。それも作ったほうがいいかな……。
miyamo型安全CSSセレクター
elm-origamiではプロパティは文字列で書けよってなってますがセレクターには型を付けてます。
これにはやむを得ぬ理由があって
spam, ham {
egg, sausage {
...
}
}
こういうネストかつセレクターリストを使われたらこういう風に平らにしたくて
spam egg, spam sausage, ham egg, ham sausage {...}
emotionとかだとSASS的なパースをしてるんじゃないかと思ってるんですが（確認する気ない）パーサーを書くのは面倒なので型付DSLを作りました。
今後
来年あたりにis, where selectorなんかがChromeとかでも使えるようになるかと思うのでそしたら型を排除して簡単な実装にしちゃおうかなと考えてます。is使ってくれ