logo
Resources
Table of content
Motiff AI
Interface
Layers and tools
Layer properties
Design systems
Prototypes
Dev Mode
Collaboration
Import and export
File settings
Account
File management
Team management
Sharing and permissions
Billing
Organization
Apps
Work with support
Help Center/Design systems/Libraries/Publish styles and components

Publish styles and components

When you first create styles and components, you can only access them in the current file. If you want to use them in other files, you need to publish them as Libraries.

Tip: Who can publish styles and components?

Publishing libraries is only available for Professional plan and Organization plan. If you are a Starter plan user, you can still create styles, components, and variables in files, but you cannot publish them.

There are several ways to access Libraries from a file:

  • Assets panel a. Click Assets in the left sidebar.Click https://conan-test.fbcontent.cn/atom-test/zye5wzwy1.svg to open Libraries.

'Libraries.png'

  • Use shortcuts
    • macOS: ⌥ Option + 3
    • Windows: Alt + 3

Publish a library

When you publish a library, make sure the file contains at least one style, component, or variable. If the file is in your drafts, you need to move it to the team first before publishing.

You can follow the steps below to publish libraries:

  1. 1.Open the Publish library modal from the file.
  2. 2.Select local libraries that you want to publish.
  3. 3.Click Publish.
  4. 4.Review the list of changes to the library, which details any new, modified, or deleted styles and components.
  5. 5.Select the changes you want to publish:
    • Check the styles and components you want to publish.
    • Uncheck the styles and components you do not want to publish.
  6. 6.After making your selection, click Publish. Motiff will display a notification confirming that your library has been successfully published.

'Publish library.png'

Publish individual components

If you only want to publish a single component instead of all components in the file, you can publish them individually using the following ways:

  • Publish via right-click:

    • Select the component you want to publish.
    • Right-click on it.
    • Choose Publish selected components.

  • Publish via the right sidebar:

    • Select the component you want to publish.
    • In the component modal in the right sidebar, select Publish changes… .

'Publish individual components and styles.png'

Publish updates

If you want to make changes to already published styles or components, you need to publish an update to the library, and then the files that reference these styles or components will receive notification updates.

Motiff will display a blue dot on https://conan-test.fbcontent.cn/atom-test/l5m6mh1ok.svg icon in the Assets panel of the left sidebar to let you know if there are updates that need to be published:

  1. 1.

    Open the Libraries modal.

  2. 2.

    Select a local library you want to publish.

  3. 3.

    Click Publish. 'Publish updates.png'

  4. 4.

    Review the list of changes to the library. This details any new, modified, or deleted styles and components.

  5. 5.

    Select the changes you want to publish:

    • Check the styles and components you want to publish
    • Uncheck the styles and components you do not wish to publish
  6. 6.

    Add a description of changes.

  7. 7.

    After completing the styles and components, click Publish. Motiff will display a notification confirming that the updates have been successfully published.

Note: If you are a user under the Organization plan, you can share the library with your organization. After publishing, members of the organization can find and use the styles and components in the library.

Before publishing, you can select the scope of the publication from the dropdown menu. 'Publish updates 2.png'

Hide styles and components

If there are styles and components you are not ready to share or are still working in progress, you can hide them from publishing. When you want to share them in the future, you can show them again to publish and share them.

There are several ways to hide styles and components:

Add prefixes to styles or components

You can hide styles and components by adding a prefix to their names. Motiff will skip these styles and components during the publishing process and place them under the Hidden group in the Assets panel and Publish libraries modal.

  • Add . before the component name.
  • Add _ before the component name.

'Publish library 3.png'

Note: If you add the above prefixes to already published styles or components, Motiff will remove them the next time you publish an update to the library. If you want to publish these hidden styles and components later, you will need to remove the prefixes from their names before publishing an update to the library.

Hide via the Assets panel

Hide components from the Assets panel. Styles cannot be hidden from the library via the style selector.

  1. 1.Click on the Assets in the left sidebar.
  2. 2.Right-click on the component in the list.
  3. 3.Choose Hide when publishing.

'Hide components.png'

Hide during the publication process

Hide styles and components from the Publish library modal.

  1. 1.Open the Publish library modal and click Publish.
  2. 2.Right-click on the component or style, and then select Hide when publishing.

'Hide when publishing.png'