`<a>`要素をボタンとしてスタイリングする`wa-button`クラスの追加

webawesomeの次期リリースでは、アンカー要素（<a>）にwa-buttonクラスを適用することで、ネイティブボタンと同じ見た目にできるようになります。これにより、リンクとボタンの視覚的な一貫性を保ちながら、セマンティクスに応じた適切なHTML要素の使い分けが可能になります。

背景

webawesomeのネイティブスタイルでは、<button>や<input type="button">などのボタン要素に統一されたスタイルを提供していましたが、ページ遷移を伴うリンクをボタンのように表示する手段がありませんでした。#1516でこの機能の再導入が要望され、本PRで実装されています。セマンティクスの観点から、ページ遷移を伴う場合は<a>要素を使用すべきですが、UIデザイン上はボタンと同じ見た目にする必要があるケースが存在します。

この変更により、適切なHTML要素を選択しながら、視覚的なデザインの統一性を維持できるようになります。

技術的な変更

packages/webawesome/src/styles/native.cssのボタン関連セレクタにa.wa-buttonが追加されました。

変更前:

button,
input[type='button'],
input[type='reset'],
input[type='submit'],
input[type='file'] {
  /* ボタンスタイル */
}

変更後:

button,
input[type='button'],
input[type='reset'],
input[type='submit'],
input[type='file'],
a.wa-button {
  /* ボタンスタイル */
}

同様の変更がAwesomeテーマ（packages/webawesome/src/styles/themes/awesome.css）とShoelaceテーマ（packages/webawesome/src/styles/themes/shoelace.css）にも適用され、テーマ固有のボタンスタイルもa.wa-buttonに適用されるようになります。

使用例として、以下のようにアンカー要素にクラスを追加するだけでボタンスタイルが適用されます：

<a href="/path" class="wa-button">Link Button</a>
<a href="/path" class="wa-button wa-brand">Branded Link Button</a>

カラーバリアント（wa-brand、wa-neutral、wa-successなど）もネイティブボタンと同様に使用できます。

設計判断

クラスベースのアプローチが採用されました。

PR内の議論やコミット履歴からは、a.wa-buttonという明示的なクラスセレクタを使用することで、意図しない要素へのスタイル適用を防いでいます。:where()疑似クラスの使用箇所が&:not(input[type='file'])に変更されていることから、ライブラリ内部のスタイル詳細度の調整も行われています。

本PRは、HTMLのセマンティクスを維持しながらUIの一貫性を実現する変更です。<a>要素と<button>要素の使い分けを適切に行いつつ、視覚的には統一されたボタンスタイルを提供することで、アクセシビリティとデザインの両立を可能にしています。