
マルコウィジェットのコレクション。すべてのeBayコンポーネント、ページ、アプリのコアビルディングブロックであると考えられています。
注:eBayUIコアコンポーネントはMarkoフラグを使用するため、コアコンポーネントを持つ任意のページに<lasso-page/>を追加する必要があります。
注: @ebay/skin/globalおよび@ebay/skin/marketsansすべてのモジュールが正しくロードされるようにアプリでロードする必要があります。
注:スプレッド属性が適切に機能するためには、少なくとも[email protected]が必要です
すべてのコンポーネントは、公式のeBayブラウザーポリシーに従って、BrowserStackを使用してクロスブラウザーを開発およびテストします。
アクセシビリティを非常に真剣に受け止めています。本当に真剣に。したがって、すべてのコンポーネントは、eBayのマインドパターンに従って構築されています。これらのパターンは、WAI-ARIAオーサリングプラクティスによって提供された仕様から構築されます。
コンポーネントは、次のリソースを利用して、階層化された徐々に強化されたファッションで構築されています。
各レイヤーは、アクセシビリティを実施および強化するためにビットを実行します。このレベルのサポートは、私たちの主要なセールスポイントの1つと考えています。あなたもそうすることを願っています!
ebay-3d-viewerebay-alert-dialogebay-avatarebay-badgeebay-breadcrumbsebay-buttonebay-calendarebay-carouselebay-character-countebay-checkboxebay-chipebay-comboboxebay-cta-buttonebay-date-textboxebay-detailsebay-drawer-dialogebay-eekebay-fake-linkebay-fake-menuebay-fake-menu-buttonebay-fake-tabsebay-filterebay-filter-menuebay-filter-menu-buttonebay-fullscreen-dialogebay-iconebay-icon-buttonebay-infotipebay-inline-noticeebay-lightbox-dialogebay-listebay-listbox-buttonebay-menuebay-menu-buttonebay-page-noticeebay-paginationebay-panel-dialogebay-phone-inputebay-progress-barebay-progress-bar-expressiveebay-progress-spinnerebay-progress-stepperebay-radioebay-section-noticeebay-section-titleebay-segmented-buttonsebay-selectebay-signalebay-skeletonebay-snackbar-dialogebay-split-buttonebay-star-ratingebay-star-rating-selectebay-switchebay-tabsebay-textboxebay-toast-dialogebay-toggle-buttonebay-toggle-button-groupebay-tooltipebay-tourtipebay-tri-state-checkboxebay-video eBayUIコアコンポーネントは、npmの@ebay/ebayui-coreパッケージとして利用できます。
NPMまたは糸を使用して、プロジェクトにパッケージの依存関係を追加します。
npm add @ebay/ebayui-core詳細については、アップグレードガイドを参照してください
パッケージの依存関係が追加されると、eBayの税関タグがMarkoテンプレートで使用できるようになりました。たとえば、 ebay-menuコンポーネントを使用するには:
< ebay-menu text = " Sort " type = " radio " >
< @item > Price </ @item >
< @item > Time </ @item >
< @item > Distance </ @item >
</ ebay-menu >属性は、コンポーネントの初期状態を提供します。メニューにはtextとtype属性があることがわかります。
< ebay-menu text = " Sort " type = " radio " >
< @item > Price </ @item >
< @item > Time </ @item >
< @item > Distance </ @item >
</ ebay-menu >eBayUIコンポーネントに新しい属性を渡すと、常に内部状態がリセットされます。自分でこの状態を維持したい場合は、イベントが公開されているため、状態を独自のコンポーネントに同期させることができます。
class {
onCreate () {
this . state = {
dialogIsOpen : false
}
}
handleDialogClose () {
this . state . dialogIsOpen = false ;
}
handleDialogOpen () {
this . state . dialogIsOpen = true ;
}
}
< ebay-lightbox-dialog
open = state . dialogIsOpen
on-open ( ' handleDialogOpen ' )
on-close ( ' handleDialogClose ' ) >
...
</ ebay-lightbox-dialog >HTML属性は任意のコンポーネントで使用でき、コンポーネントの最も顕著なタグに渡されます。最も顕著なタグは通常、ルートまたはフォームコントロールですが、個々のコンポーネントが特定の場合に変化するかどうかに注意します。
静的使用の例:
< ebay-button id = " my-button " />パススルー属性を動的に使用するには、 html-attributes属性を介して送信する必要があります。
$ const myAttributes = { id : ' my-button ' };
< ebay-button html-attributes = myAttributes />静的および動的なパススルー属性は同時に使用できます(HTML-Attributesは競合で優先されます):
$ const myAttributes = { id : ' my-button ' };
< ebay-button html-attributes = myAttributes type = " submit " />イベントは、Marko構文を使用して処理することもできます。
< ebay-menu text = " Sort " type = " radio " on-change ( " onMenuChange " ) >
< @item > Price </ @item >
< @item > Time </ @item >
< @item > Distance </ @item >
</ ebay-menu >今後のロードマップとリリース履歴については、リリースとマイルストーンのページを参照してください。
eBayui-Coreパッケージは、厳密なセマンティックバージョンに従います。
バージョン番号major.minor.patchを与えられます:
非難はリリースノートを介して伝えられるので、それらを注意深く読むことを確認してください。一般に、次のメジャーバージョンで非推奨機能が削除されることを期待してください。ただし、場合によっては、もう少し待つことがあります。
問題ページを使用して、質問をしたり、問題を報告したり、機能リクエストを送信したりしてください。
あなたの問題を追跡するために、私たちの管理者はそれを1つ以上の色のラベルで割り当てます:
eBay UIに貢献したいですか?詳細については、寄付ページをご覧ください。
Copyright(c)2018 eBay Inc.
このソースコードの使用は、ライセンスファイルまたはhttps://opensource.org/licenses/mitにあるMITスタイルのライセンスによって管理されます。
一部のコンポーネントを使用するには、サードパーティからの個別の非オープンソースライセンスが必要です
eBayuiライブラリのデータ視覚化コンポーネントとチャートコンポーネントは、1つ以上のHighCharts®ソフトウェア製品を使用するように設計されています。 HighCharts®は、HighSoft ASの登録商標です。 eBayと提携していないHighSoft。 eBayは、データの視覚化コンポーネントとチャートコンポーネントが使用するように設計されているHighCharts®ソフトウェア製品に関して、明示的であろうと黙示的であろうと、いかなる種類の保証も提供しません。
HighCharts®ソフトウェア製品の商用使用には、HighSoftが提供する有料ライセンスが必要です。 eBayUIライブラリの多くのコンポーネントはMITライセンスの下でライセンスされていますが、eBayUIライブラリのデータ視覚化コンポーネントとチャートコンポーネントが使用するように設計されているHighCharts®ソフトウェア製品は、MITライセンスまたはその他のオープンソースライセンスに基づいてライセンスされていません。 HighCharts®ソフトウェア製品に関連する権利(例:使用、インストール、配布、出版、マージ、複製、および変更を含むがこれらに限定されない)は、http://www.highcharts.comでオンラインで利用可能な1つまたは複数の独自のライセンス契約の条件によって管理されます。 HighSoftは、非営利的な使用のためにHighCharts®ソフトウェア製品のライセンスを取得することを選択しますが、HighCharts®ソフトウェア製品を使用してHighSoftの条件を検証することを希望する当事者の責任です。このライセンスの規定にかかわらず、HighCharts®ソフトウェア製品を使用するためにHighSoftによってライセンスを取得していない当事者は、eBayuiライブラリのデータ視覚化コンポーネントとチャート化コンポーネントを使用するライセンスはありません。
この通知は、ソフトウェアのすべてのコピーまたはかなりの部分に含まれるものとします。