高速ドラッグ アンド ドロップであらゆる技術スタック上であらゆるエクスペリエンスを実現
ドキュメント| ?例| ?仕組み
プラグマティック ドラッグ アンド ドロップは、ブラウザに組み込まれたドラッグ アンド ドロップ機能を安全かつ適切に使用できるようにする低レベルのドラッグ アンド ドロップ ツールチェーンです。実用的なドラッグ アンド ドロップは、任意のビュー レイヤー ( react 、 svelte 、 vue 、 angularなど) で使用できます。プラグマティックなドラッグ アンド ドロップは、Trello、Jira、Confluence などの Web 上の最大の製品の一部を強化しています。
実用的なドラッグ アンド ドロップは、いくつかの高レベルの部分で構成されます。
Pragmatic ドラッグ アンド ドロップには、コア パッケージと、ドラッグアンド ドロップ エクスペリエンスを作成するための要素を提供する多数のオプション パッケージが含まれています。
これらの作品は、ビジュアル言語やアクセシビリティに関して独自の意見を持たず、Atlassian Design System に依存しません。
4.7kBコア一貫したアトラシアン ユーザー エクスペリエンスを非常に高速に構築できるように、オプションのビジュアル出力 (ドロップ インジケーターなど) を作成しました。アトラシアン以外のユーザーも、これらの出力を使用したり、ビジュアル スタイルをコピーした独自の出力を作成したり、まったく異なる方向に進むことを歓迎します。
すべてのユーザーがポインター ベースのドラッグ アンド ドロップ エクスペリエンスを実現できるわけではありません。支援技術ユーザーに素晴らしいエクスペリエンスを実現するために、あらゆるエクスペリエンスに合わせてパフォーマンスの高い支援技術フレンドリーなフローを迅速に接続できるツールチェーンを提供します。
当社が提供するオプションの支援コントロールは、Atlassian Design System に基づいています。 Atlassian Design System を使用したくない場合は、当社のガイドラインを使用して当社のコンポーネントを独自のコンポーネントで置き換えることも、必要に応じて別の方法でアクセシビリティを実現することもできます。
このリポジトリは現在、Pragmatic ドラッグ アンド ドロップのすべてのコードを含む内部モノリポジトリからの一方向ミラーです。
このリポジトリの目的は、コードを公開することですが、(この段階では) コードの寄稿を受け入れることではありません。将来的には、このリポジトリへの貢献がモノリポジトリにも戻されるように、双方向ミラーの設定を検討する可能性があります。このリポジトリに関して問題や提案を提起することは引き続き歓迎されます。
すべてのドキュメントとnpmパッケージは公開されており、誰でも使用できます。
そうだ！小さなコア パッケージとして実用的なドラッグ アンド ドロップを実行し、次に一連のオプション パッケージを追加します。オプションのパッケージの一部は、スタイリング ソリューション (例: emotion )、ビュー ライブラリ(例: react )、または追加のアトラシアン出力(例: @atlaskit/tokens )に依存しています。他の依存関係を持つオプションのパッケージを分離したので、独自の技術スタックとビジュアル出力を使用する独自の部分と簡単に交換できます。
そうだ！当社では、製品でドラッグ アンド ドロップを実現する方法を具体化するいくつかの設計ガイドラインを作成しており、それらの決定事項の一部は、いくつかのオプション パッケージに具体化されています。ただし、私たちのものを含め、好きなデザイン言語を自由に使用できます。
@atlaskitとは何ですか? Pragmatic ドラッグ アンド ドロップ パッケージは、 npmの@atlaskit名前空間で公開されます。
import { draggable } from '@atlaskit/pragmatic-drag-and-drop/element/adapter' ; @atlaskitは、内部モノリポジトリ内からすべてのパブリック パッケージを公開するnpm名前空間です。将来的には、Pragmatic ドラッグ アンド ドロップ専用の別の名前空間の作成を検討する可能性があります。そうする場合、人々が自動的に切り替えるのを支援するツールをリリースする予定です。
愛を込めて作られました:
プラグマティックなドラッグ アンド ドロップは、ドラッグ アンド ドロップの仕様を作成した人々、ブラウザにドラッグ アンド ドロップを実装した人々、そしてそれ以前に登場した多くのドラッグ アンド ドロップ ライブラリを含む巨人の肩の上に立っています。
