style-dictionary icon indicating copy to clipboard operation
style-dictionary copied to clipboard

Docs "Format Configuration" has a mistake

Open jorenbroekema opened this issue 2 years ago • 2 comments

Hey, I believe I spotted an error in the docs here https://amzn.github.io/style-dictionary/#/formats?id=format-configuration

{
  "files": [{
    "destination": "map.scss",
    "format": "scss/map-deep",
    "mapName": "my-tokens"
  }]
}

should be

{
  "files": [{
    "destination": "map.scss",
    "format": "scss/map-deep",
    "options": {
      "mapName": "my-tokens"
    }
  }]
}

At least, this is what works for me for css/variables selector option: Playground link

Happy to send a PR with fix

jorenbroekema avatar Mar 01 '22 15:03 jorenbroekema

Hey @jorenbroekema thanks for bringing this up! I believe it is actually correct as is. Looking at the source code for the scss/map-deep format, it is accessing mapName from the file object directly and not the options object on the file: https://github.com/amzn/style-dictionary/blob/main/lib/common/templates/scss/map-deep.template#L20

We have been working towards moving configuration onto the options object with more recent additions though so this might be something we want to update in the future.

Also, the playground link you sent doesn't appear to show the issue. Here is what I am seeing:

CleanShot 2022-03-08 at 14 11 30@2x

dbanksdesign avatar Mar 08 '22 22:03 dbanksdesign

Yeah in the playground it's correct, and it's inside an options object. I guess it was moved into the options object for some default formats but not others?

{
  "files": [{
    "destination": "map.scss",
    "format": "scss/map-deep",
    "mapName": "my-tokens"
  }]
}

versus

{
  "files": [{
    "destination": "_variables.css",
    "format": "css/variables",
    "options": {
      "selector": ":host"
    }
  }]
}

jorenbroekema avatar Mar 08 '22 22:03 jorenbroekema