公開済みコンポーネントの移動
この機能を使用できるユーザー
プロフェッショナルプラン、エデュケーションプラン、およびビジネスプランでサポートされます
移動元ファイルと移動先ファイルの両方の編集可アクセス権があるユーザーだけが、ファイル間でコンポーネントを移動できます。
別のファイルにスタイルを移動するには、「スタイルの管理と共有」で詳しい手順を参照してください。
公開済みコンポーネントとコンポーネントセットを、インスタンスへのリンクを維持した状態でファイル間で移動します。このプロセスは、大きいライブラリを小さいファイルに分割するときに使用します。
公開済みコンポーネントを移動するときに使用できるのは、このプロセスだけです。ファイル間ではメインコンポーネントとそのインスタンスをコピーして貼り付けることができます。Figmaでは、コンポーネントとインスタンスが同じファイルにある限り、コンポーネントとインスタンスの間の関連付けが維持されます。
これは、コンポーネントの切り取りおよび貼り付けと、変更の公開という2段階のプロセスです。コンポーネントを移動し、関連付けられているインスタンスを更新するには、この両方を行う必要があります。
仕組み
各コンポーネントには一意のIDがあります。FigmaではこのIDを使用して、メインコンポーネントとそのインスタンスのコネクションが維持されます。
ファイル間でコンポーネントを切り取って貼り付けると、貼り付けられたコンポーネントは新しいコンポーネントとして扱われます。新しいコンポーネントには、元のメインコンポーネントとは異なる一意のIDが設定されます。
この複製をライブラリに公開すると、登録済みファイルに対してこの変更が通知されます。これらの更新を受け入れると、公開先ライブラリからインスタンスに切り替わります。
このようなメカニズムのため、このプロセスを取り消すことはできません。このアクションを取り消す ↓ための唯一の方法は、コンポーネントを元のファイルに戻すことです。
ライブラリアナリティクスを使用する場合 組織のライブラリアナリティクスでは、移動されたコンポーネントは新しいコンポーネントとして扱われます。ライブラリアナリティクスの詳細はこちら →
用語
- 公開済みコンポーネント: チームまたは組織のライブラリに公開されているコンポーネント。ファイル、プロジェクト、またはチーム内のインスタンスは、公開済みコンポーネントから更新を取得できます。
- ローカルコンポーネント: 現在のファイルに含まれており、ライブラリに公開されていないコンポーネント。ローカルインスタンスは、コンポーネントと同じファイルに含まれている場合にのみ更新されます。これには、意図的に非表示にしたコンポーネントも含まれます。
- 移動元ファイル: コンポーネントの移動アクションに関連する固有の用語です。移動元ファイルとは、新しい場所に移動する前に、コンポーネントが含まれていたファイルです。
- 移動先ファイル: コンポーネントの移動アクションに関連する固有の用語です。移動先ファイルとは、コンポーネントの移動先のファイルです。新しいファイル/ライブラリまたは既存のファイル/ライブラリを移動先ファイルとして使用できます。
- 登録済みファイル: アクティブな公開済みライブラリにリンクしているスタイルとインスタンスが含まれているFigmaデザインファイルまたはFigJamファイルです。
コンポーネントまたはコンポーネントセットの移動
コンポーネントを移動する前に、いくつかの点を考慮する必要があります。コンポーネントが新しい場所で意図したとおりに動作するように、これらの手順を確認することをお勧めします。
1. 非表示コンポーネントの公開
非表示コンポーネントとはライブラリに公開していないコンポーネントです。非表示コンポーネントはファイル間で移動できません。
非表示コンポーネントのネストしたインスタンスを使用するコンポーネントがある場合、別のファイルに移動する前に非表示コンポーネントを公開する必要があります。非表示コンポーネントを移動して変更をライブラリに公開したら、コンポーネントを再び非表示にできます。
プロセス全体は次のようになります。
2. ネストしたインスタンスとオーバーライドの確認
ネストしたインスタンスを使用するメインコンポーネントがある場合、メインコンポーネントがある場所を考慮する必要があります。これは特に、メインコンポーネントにオーバーライドを適用している場合に重要です。
メインコンポーネントが同じファイル内にある場合は、コンポーネントをまとめて移動して公開することをお勧めします。ネストしたインスタンスのメインコンポーネントが非表示の場合は、最初にメインコンポーネントを公開する必要があります。
コンポーネントで別の公開済みライブラリのメインコンポーネントが使用されている場合、そのライブラリへの関連付けは維持されます。
コンポーネントの変更を始める前に、公開先ライブラリからコンポーネントを公開することをお勧めします。
例を使った説明
ダイアログウィンドウのメインコンポーネントがあります。このメインコンポーネントには、ボタンコンポーネントとアイコンコンポーネントのネストしたインスタンスがあります。アイコンとボタンはいずれも非表示コンポーネントです。
ダイアログコンポーネントのインスタンスでは、汎用情報アイコンが警告アイコンと入れ替わっており、色のオーバーライドがアイコンボタンとプライマリーボタンの両方に適用されます。
これらのコンポーネントを移動してオーバーライドを維持するには、次の手順に従います。
- アイコンコンポーネントとボタンコンポーネントをライブラリに公開します。非表示のコンポーネントの公開 →
- 現在のファイルからすべてのコンポーネントを切り取ります。これには、アイコンコンポーネント、ボタンコンポーネント、およびこれらのコンポーネントのインスタンスを使用するダイアログコンポーネントが含まれます。
- 切り取ったコンポーネントを移動先ファイルに貼り付けます。以下の説明を参照 ↓
- 移動先ファイルをライブラリとして公開します。以下の説明を参照 ↓
- 登録済みファイルでライブラリからの更新を受け入れます。ライブラリの更新の受け入れ →
- アイコンとボタンの両方のメインコンポーネントを非表示にします。公開時にコンポーネントを非表示にする →
3. 削除済みバリアントの復元と保存
コンポーネントセットを移動するには、ファイル間でコンポーネントを切り取って貼り付ける必要があります。切り取りと貼り付けの実行時に存在していたバリアントだけがコピーされます。
バリアントを削除しても今後使用する場合は、移動元ファイルでこのバリアントを復元する必要があります。この操作はコンポーネントセットの移動前に行うことをお勧めします。ただし、移動元ファイルが存在している限り、コンポーネントセットの移動後でもバリアントは復元できます。
- 削除されたバリアントをインスタンスから復元します。これにより、バリアントが元のファイルでメインコンポーネントとして復元されます。
- 復元したコンポーネントを、移動元ファイルのライブラリに公開します。移動できるコンポーネントは公開済みコンポーネントだけです。
- 切り取りと貼り付けの手順を使用して、切り取ったコンポーネントを移動先ファイルに貼り付けます。
- 移動したコンポーネントを既存のコンポーネントセットにドラッグします。
コンポーネントの切り取りと貼り付け
ファイルおよびライブラリ間で切り取りと貼り付けを実行して、公開済みコンポーネントとコンポーネントセットを移動します。コンポーネントとインスタンスの間の関連付けを維持するか、完全に新規のコンポーネントとして扱うかを選択できます。
メインコンポーネントをファイルのブランチに貼り付けることができます。ブランチがマージされてライブラリが公開されるまでは、ライブラリと登録済みファイルは更新されません。
コンポーネントまたはコンポーネントセットを移動するには、次の手順に従います。
- メインコンポーネントが含まれているファイルを開きます。これは移動元ファイルです。
- 移動するメインコンポーネントまたはコンポーネントセットを選択します。
- 切り取りのショートカットを使用して、コンポーネントまたはコンポーネントセットをクリップボードに追加します。
- Mac: ⌘ Command - X
- Windows: Ctrl + X
- コンポーネントを移動するファイルを開きます。これは移動先ファイルです。
- 何も選択されていないことを確認してから、ファイルにコンポーネントを貼り付けます。
- Mac: ⌘ Command - V
- Windows: Ctrl + V
メモ: 公開前にコンポーネントを変更できます。まずライブラリを公開から、コンポーネントとバリアントに対して構造的な変更を行うことをお勧めします。
ライブラリの変更の公開
ファイル間で公開済みコンポーネントを移動する場合は、影響のあるライブラリへの変更を公開することが求められます。ライブラリに変更が加えられると、上部のツールバーの[ライブラリ]アイコンに青いバッジが表示されます。
移動プロセスを完了するには、これらの変更を公開する必要があります。変更を公開すると、すべての登録済みファイルに更新がプッシュされます。
- 上部のツールバーの[ライブラリ]アイコンをクリックし、[ライブラリ]モーダルを開きます。
- [ライブラリ]タブを選択します。
- このファイルに移動したすべてのコンポーネントを含め、ライブラリの変更がすべてリストされます。コンポーネントごとに、[このファイルに移動]または[コピーとして公開]を選択します。
- 移動するすべてのコンポーネントで[このファイルに移動]を選択します。これにより、メインコンポーネントと既存のインスタンスの間の関連付けが維持されます。
- コンポーネントを新しいメインコンポーネントとして公開するには、[コピーとして公開]を選択します。これにより、コンポーネントとインスタンスのコネクションが解除され、インスタンスは以後更新を取得しなくなります。
- 変更の説明を追加します。この説明はファイルのバージョン履歴に表示されます。
- [公開]をクリックして、変更をライブラリに公開します。
更新の取得
Figmaにより、スタイルおよびコンポーネントを使用するファイルに更新がプッシュされます。現在のページのスタイル、コンポーネント、またはバリアブルの更新が利用可能になると、上部のツールバーの[ライブラリ]アイコンに青色のバッジが表示されます。
更新を確認して受け入れるまでは、移動元ファイルの削除済みコンポーネントにインスタンスがリンクされた状態のままになります。登録済みファイルで更新を受け入れ、ローカルインスタンスを更新します。
登録済みファイル
更新を取得する前にインスタンスを選択または編集すると、移動元ファイルの削除済みメインコンポーネントが引き続きポイントされます。ライブラリから更新を取得すると、移動先ファイルのメインコンポーネントがポイントされます。
移動元ファイルのローカルインスタンス
これらのコンポーネントが移動先ファイルのライブラリに公開されるまで、移動元ファイルのローカルインスタンスは更新を取得しません。
[更新]をクリックして更新を取得し、インスタンスが新しい場所のコンポーネントにリンクされていることを確認します。
移動先ファイルのローカルインスタンス
移動先ファイルのインスタンスが移動元ファイルから移動したコンポーネントにリンクされている場合、これらのインスタンスは自動的に更新され、新しく移動されたローカルコンポーネントをポイントするようになります。
メモ: 登録済みファイルで新しいライブラリが有効になっていない場合、インスタンスが更新を取得すると、登録済みファイルでライブラリが有効になります。
コンポーネントの移動の取り消し
次のいずれの方法でも、コンポーネントの移動アクションを取り消すことはできません。
- 取り消しのキーボードショーカットを使用する
- 削除済みコンポーネントのインスタンスからの復元
- ファイルのバージョン履歴の古いバージョンを復元する
ファイルではこれらのアクションを実行できますが、コンポーネントが元の場所に戻ることはなく、予期しない結果が発生する可能性があります。
コンポーネントを元の場所に戻すには、前述のコンポーネント移動プロセス ↑を使用することをお勧めします。