yamanoku

なぜReact Ariaなのか？

このページでは、React Aria が存在する理由と、それが解決する問題について説明します。

動機

デザインシステムはかつてないほど普及しており、大小を問わず多くの企業が独自のコンポーネントライブラリをゼロから実装しています。Reactのような最新のビューライブラリにより、チームはこれらのコンポーネントをこれまで以上に簡単に構築して保守することができますが、多くの種類のデバイス間で動作するインタラクションを完全にアクセス可能な方法で行うことは、まだ非常に困難です。

ウェブは非常にユニークなプラットフォームです。非常に多様なデバイスとインタラクションモデルで動作し、プラットフォームの美学が明確に定義されていないため、各企業は通常、デザインシステムの各コンポーネントを自社のブランドに合わせてスタイル化する必要があります。ブラウザに内蔵されているUIコントロールは非常に少なく、存在するものはスタイルを整えるのが非常に困難です。そのため、あらゆる企業のウェブ開発者は、すべてのコントロールを一から作り直す必要があります。これは、他の多くの企業が行っている作業を重複して行うために、各企業が何百万ドルもの投資を行っていることを意味します。

ウェブが提供する完全にスタイル可能なプリミティブ(例:``)は非常に強力ですが、意味的な意味を欠いています。つまり、コンポーネントを実装するために使用している div スープの意味を支援技術が理解できないため、アクセシビリティが欠落していることが多いということです。ARIAを使用してセマンティクスを提供する場合でも、JavaScriptを使用して各コンポーネントのすべての動作をゼロから実装する必要があり、これを多くのデバイスやインタラクションモデルにまたがって行うのは厄介です。

sindresorhus

Pure ESM package

The package that linked you here is now pure ESM. It cannot be require()'d from CommonJS.

This means you have the following choices:

1. Use ESM yourself. (preferred)
   Use import foo from 'foo' instead of const foo = require('foo') to import the package. You also need to put "type": "module" in your package.json and more. Follow the below guide.
2. If the package is used in an async context, you could use await import(…) from CommonJS instead of require(…).
3. Stay on the existing version of the package until you can move to ESM.