MkTheme-Util is a CLI tool that allows converting Figma Tokens configuration file to Hive Design System theme.

Options

• -f, --figma - Figma Tokens export file name
• -t, --theme - name of a theme that should be updated
• -b, --base-theme - name of theme that should be used as base one if its name is not baseTheme
• -s, --silent - prevents printing any message to console
• -h, --help - shows the util's help
• --version - show the util's version

Usage

In Figma

1. In the Hive Design System Figma file, run the Figma Tokens plugin: ⌘+/ → Figma Tokens
2. Go to Sync → GitHub and push the latest changes to GitHub by clicking the library icon.

For importing the theme

1. Download the tokens.json file from the Hive Design Tokens repository to any folder.

2. In the folder run npx @sinchsmb/mktheme@latest -f tokens.json -t THEME_NAME EXPORT_FILE.json where:

   • THEME_NAME is a name of a theme that you want to update
   • EXPORT_FILE.json is a converting output file
   • Example: npx @sinchsmb/mktheme@latest -f tokens.json -t SinchSMB sinchSMB.json.

3. Configure the HiveUI component using new theme

   Example:

     import { HiveUI } from '@sinchsmb/ui-kit';
     import theme from './sinchSMB.json';
     <HiveUI theme={theme} {...otherProps}>{/* UI code */}</Hive>