Umbraco.UI

これは、Umbraco CMSと友人のUI-Libraryです。これは、Umbracoスタイルのインターフェイスを構築するために使用できるユーザーインターフェイスコンポーネントのコレクションです。

要素は、LITで構築されたWebコンポーネントであり、UIライブラリストーリーブックで表示されることを目的としています。

ストーリーブックは、コンポーネントの開発環境でもあります。

プロジェクトでコンポーネントを使用する場合は、以下の表で見つけて、コンポーネントREADMEの指示に従ってください。

コンポーネントを開発したり、リポジトリに貢献したりする場合は、「開始」セクションにアクセスしてください。

コンポーネント

成分	状態
uuiバンドルパッケージ
uui-cssバンドルパッケージ
<uui-action-bar>
<uui-avatar>
<uui-avatar-group>
<uui-badge>
<uui-base>
<uui-boolean-input>
<uui-box>
<uui-breadcrumbs>
<uui-button>
<uui-button-group>
<uui-button-inline-create>
<uui-card>
<uui-card-content-node>
<uui-card-media>
<uui-card-user>
<uui-caret>
<uui-checkbox>
<uui-color-area>
<uui-color-picker>
<uui-color-slider>
<uui-color-swatch>
<uui-color-swatches>
<uui-combobox>
<uui-combobox-list>
<uui-dialog>
<uui-dialog-layout>
<uui-file-dropzone>
<uui-file-preview>
<uui-form>
<uui-form-layout-item>
<uui-form-validation-message>
<uui-icon>
<uui-icon-registry>
<uui-icon-registry-essential>
<uui-input>
<uui-input-file>
<uui-input-lock>
<uui-input-password>
<uui-keyboard-shortcut>
<uui-label>
<uui-loader>
<uui-loader-bar>
<uui-loader-circle>
<uui-menu-item>
<uui-modal>
<uui-pagination>
<uui-popover>
<uui-popover-container>
<uui-progress-bar>
<uui-range-slider>
<uui-radio>
<uui-ref>
<uui-ref-list>
<uui-ref-node>
<uui-ref-node-data-type>
<uui-ref-node-document-type>
<uui-ref-node-form>
<uui-ref-node-member>
<uui-ref-node-package>
<uui-ref-node-user>
<uui-scroll-container>
<uui-select>
<uui-slider>
<uui-symbol-expand>
<uui-symbol-file>
<uui-symbol-file-dropzone>
<uui-symbol-file-thumbnail>
<uui-symbol-folder>
<uui-symbol-lock>
<uui-symbol-more>
<uui-symbol-sort>
<uui-table>
<uui-tabs>
<uui-tag>
<uui-textarea>
<uui-toast-notification>
<uui-toast-notification-container>
<uui-toast-notification-layout>
<uui-toggle>
<uui-visually-hidden>

始めましょう

インストール

このプロジェクトはnodejsを使用するため、 nodejsマシンのパッケージマネージャーとしてインストールする必要があります。インストールガイドを参照してください。 UIライブラリは、NPMワークスペースの使用により、バージョン7以下のNPMが必要です。

git clone https://github.com/umbraco/Umbraco.UI.git
cd . U mbraco.UI
npm install

ストーリーブックを実行します

このコマンドは、サーバーを実行しているストーリーブックを起動し、変更を監視します。

npm run storybook

テストを実行します

このコマンドは、プロジェクトを構築し、テストを実行します。

npm run test

スクリプトの概要

• storybook 、要素のストーリーブックを開きます
• storybook:analyze custom-elements.jsonファイルの生成または更新を分析します
• test 、Webテストランナーでテストスイートを実行します
• format 、LinterとAutoformatterを実行します

こちらの残りのスクリプトをご覧ください。

貢献

• ？リクエストをプルしますか？星はいつでも大歓迎です。
• 貢献ガイドを読んでください。
• 問題トラッカーにバグと機能のリクエストを報告してください
• メインブランチは、最新の開発ブランチです。このブランチに対するプルリクエストをお願いします： v1/contrib
  • このブランチに添付されているストーリーブックの最新の機能を見ることができます：V1/contrib