全コンポーネントは外部からスタイルを変更できるようにした方が幸せなんじゃないか説

設計の敗北ではないかと言われたら恐らくそれはそうな話なのだが、コンポーネントのバリエーションが多すぎると属性の数が多くなって煩雑になってしまった。
基本的には css で解決したい話ではあるが、類似品が多すぎるとそうもいかずに無限に増え続ける。

そうなった時に、デザインをある程度の形式にまとめることも重要であるとは思うが、私みたいに二次請三次請になってくると現場からのデザインの戻しも中々できない。
仕方がないので属性を生やしまくっていたが、結局一回しか登場する機会のない属性を生やすのであればもうインラインスタイルでよくないかと思ってしまった。

Astro の場合、

---
import { type HTMLAttributes } from 'astro/types';

interface Props extends HTMLAttributes<'div'> {}

const { ...attrs } = Astro.props;
---

<div { ...attrs } class="">
</div>

にすることで全部解決する。
マージンが違うのであれば style={{ margin: '50px auto' }} を書けば良いし、他の属性も変幻自在に定義できる。
デザインシステムの崩壊としか思えないが、短期で使い捨てられる LP の構築はコンポーネントすら無駄なんじゃないかと思ってきた。

どうせ誰も見ないし評価もしない HTML のソースコードにいちいちこだわっていても仕方ない。
精々評価してくれるのは無茶な修正が来た数ヶ月、数年後の自分だけだ。