Class: Backpack::Commands::Sync

Inherits:
Object
  • Object
show all
Includes:
Thor::Actions
Defined in:
lib/backpack/commands/sync.rb

Overview

Sync command for importing design tokens from Figma to CSS files

This command looks for files in the current working directory:

  • figma/Backpack.json (Figma design tokens export)

  • lib/backpack/stylesheets/tokens/*.css (CSS token files to update)

Usage: backpack sync

Instance Method Summary collapse

Constructor Details

#initialize(shell = Thor::Base.shell.new) ⇒ Sync

Returns a new instance of Sync.



19
20
21
# File 'lib/backpack/commands/sync.rb', line 19

def initialize(shell = Thor::Base.shell.new)
  @shell = shell
end

Instance Method Details

#syncObject



23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
# File 'lib/backpack/commands/sync.rb', line 23

def sync
  @shell.say "Syncing design tokens from Figma...", :green

  layout_json = File.read(layout_tokens_file)
  layout = JSON.parse(layout_json, symbolize_names: true)

  raise "Wrong name" if layout[:name] != NAME

  modes = layout[:modes]
  tokens = extract_tokens(layout[:variables], modes)

  # Read all CSS files
  tokens_css_files = Dir.glob("#{tokens_folder}/*.css")

  rewritten_lines_count = 0
  remaining_tokens = tokens.keys

  tokens_css_files.each do |file|
    lines_rewritten = process_css_file(file, tokens, remaining_tokens)
    rewritten_lines_count += lines_rewritten

    if lines_rewritten > 0
      file_name = File.basename(file)
      @shell.say "#{file_name}: #{lines_rewritten} lines rewritten", :yellow
    end
  end

  if remaining_tokens.any?
    @shell.say ""
    @shell.say "#{remaining_tokens.size} tokens have not been found:", :red
    remaining_tokens.each do |token|
      @shell.say token
    end
    @shell.say "Please check that these tokens are correctly named."
  else
    @shell.say "All tokens synced successfully!", :green
  end
end