{"_id":"@demogar/plaqueta-ds","_rev":"6-4ac620b7b595e75e123bae88cdc36d78","name":"@demogar/plaqueta-ds","dist-tags":{"latest":"1.0.6"},"versions":{"1.0.0":{"name":"@demogar/plaqueta-ds","version":"1.0.0","description":"Design System for PlaquetaDS","author":{"name":"Demóstenes García G.","email":"me@demogar.com"},"license":"MIT","main":"build/js/tokens.json","private":false,"scripts":{"build":"style-dictionary build","clean":"style-dictionary clean","watch":"style-dictionary watch"},"devDependencies":{"style-dictionary":"^3.9.0"},"gitHead":"9741d3eae5ceb78a71143e03fbd629e98d59735e","_id":"@demogar/plaqueta-ds@1.0.0","_nodeVersion":"16.13.2","_npmVersion":"8.1.2","dist":{"integrity":"sha512-KBSbOKpnPIz62kxKVO9TclISL5iY/a3LOf4QoKIlgCtlWwU0iko67QNBP3vlwb6B5TdPXRifjKiWit6O7TKUBA==","shasum":"8e7c9e3ae3d28b78169daca5ae543e8eb76e13c5","tarball":"https://registry.npmjs.org/@demogar/plaqueta-ds/-/plaqueta-ds-1.0.0.tgz","fileCount":18,"unpackedSize":89585,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQC4bM+dImPKTIRMPK11w5wL6Nov9acXd9lV9/mHHXqlCAIhAKl/H5JD6ozzc2XK5fcSDrrOsE0iFVopYNYXisiuuiPI"}]},"_npmUser":{"name":"demogar","email":"me@demogar.com"},"directories":{},"maintainers":[{"name":"demogar","email":"me@demogar.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/plaqueta-ds_1.0.0_1699807016884_0.25843027182846434"},"_hasShrinkwrap":false},"1.0.1":{"name":"@demogar/plaqueta-ds","version":"1.0.1","description":"Design System for PlaquetaDS","author":{"name":"Demóstenes García G.","email":"me@demogar.com"},"license":"MIT","main":"build/js/tokens.json","private":false,"scripts":{"build":"style-dictionary build","clean":"style-dictionary clean","watch":"style-dictionary watch","publish":"npm publish --access=public"},"devDependencies":{"style-dictionary":"^3.9.0"},"gitHead":"3e0d21debc30d9b28abec4705af62a8b7c538b3b","_id":"@demogar/plaqueta-ds@1.0.1","_nodeVersion":"16.13.2","_npmVersion":"8.1.2","dist":{"integrity":"sha512-KETeRgdQirU7NeY7LgXQ7cYCo6ddwaRlP8TiDrYbpSHKJYaK4ncIiXX8Vjaz3qI3ZubmYrdQ9Lf8QdPzo28nMw==","shasum":"61939451795ebc378808d15488477741cd6ec509","tarball":"https://registry.npmjs.org/@demogar/plaqueta-ds/-/plaqueta-ds-1.0.1.tgz","fileCount":18,"unpackedSize":89639,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCICVOm0Or4yGJP/UsDKeYx3hRmK/rrjVccOAFvBpk1gjMAiEAtiQlnea4hpObOtUtW/XxfnCMtW9+te9LXTYJFLP6FPY="}]},"_npmUser":{"name":"demogar","email":"me@demogar.com"},"directories":{},"maintainers":[{"name":"demogar","email":"me@demogar.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/plaqueta-ds_1.0.1_1699807798249_0.9408980310386938"},"_hasShrinkwrap":false},"1.0.2":{"name":"@demogar/plaqueta-ds","version":"1.0.2","description":"Design System for PlaquetaDS","author":{"name":"Demóstenes García G.","email":"me@demogar.com"},"license":"MIT","main":"build/js/tokens.json","private":false,"scripts":{"build":"style-dictionary build","clean":"style-dictionary clean","watch":"style-dictionary watch","publishpkg":"npm publish --access=public"},"devDependencies":{"style-dictionary":"^3.9.0"},"gitHead":"87fc8379e611ce7c30ff603f6569aeaa01229e50","_id":"@demogar/plaqueta-ds@1.0.2","_nodeVersion":"16.13.2","_npmVersion":"8.1.2","dist":{"integrity":"sha512-+3lWZ98XcQ4ABD84TIYUeVdLcTLgi65iZOkenl9war1KJHLcYgYYYvDII7CDLPY3JHR7zbQbniPW9nLve0WDcw==","shasum":"c152491bab124c9ef9bf1cfb105768986824d549","tarball":"https://registry.npmjs.org/@demogar/plaqueta-ds/-/plaqueta-ds-1.0.2.tgz","fileCount":19,"unpackedSize":93048,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIAVfnWN3zRGdRiS33cGswuK6a1cecP0aKNfKx/0ZqKtQAiAoLBM98KDQGz/FAx2RSiS1GxFWVYwPNaqmy9IxBBxMZA=="}]},"_npmUser":{"name":"demogar","email":"me@demogar.com"},"directories":{},"maintainers":[{"name":"demogar","email":"me@demogar.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/plaqueta-ds_1.0.2_1699895236127_0.9857711028107563"},"_hasShrinkwrap":false},"1.0.3":{"name":"@demogar/plaqueta-ds","version":"1.0.3","description":"Design System for PlaquetaDS","author":{"name":"Demóstenes García G.","email":"me@demogar.com"},"license":"MIT","main":"build/js/tokens.json","private":false,"scripts":{"build":"style-dictionary build","clean":"style-dictionary clean","watch":"style-dictionary watch","publishpkg":"npm publish --access=public"},"devDependencies":{"style-dictionary":"^3.9.0"},"gitHead":"6f0d874f9f10d6666bfa6e928e215817e7d6d4cc","_id":"@demogar/plaqueta-ds@1.0.3","_nodeVersion":"16.13.2","_npmVersion":"8.1.2","dist":{"integrity":"sha512-EUtf1Li4phHtMWofC6u5pq4ro9olUA+j/O/dMdYbr/d9F8f3sysCuSE0/xBHdH3/TXGz21w0X/K2BJPJnANfow==","shasum":"ac8e251c974e7a5299061761d79cf10aa5a7fed1","tarball":"https://registry.npmjs.org/@demogar/plaqueta-ds/-/plaqueta-ds-1.0.3.tgz","fileCount":19,"unpackedSize":93050,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIFrdW8ySpuRSWWnKDj1bi5gQli3mgjYlNvWr8ZTUvyXRAiAySzWHv/mkFdt/5nFDF9/TtU09J1fJKOiCDgAnsnTgvA=="}]},"_npmUser":{"name":"demogar","email":"me@demogar.com"},"directories":{},"maintainers":[{"name":"demogar","email":"me@demogar.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/plaqueta-ds_1.0.3_1699897231400_0.9871486153895208"},"_hasShrinkwrap":false},"1.0.4":{"name":"@demogar/plaqueta-ds","version":"1.0.4","description":"Design System for PlaquetaDS","author":{"name":"Demóstenes García G.","email":"me@demogar.com"},"license":"MIT","main":"build/js/tokens.json","private":false,"scripts":{"build":"style-dictionary build","clean":"style-dictionary clean","watch":"style-dictionary watch","publishpkg":"npm publish --access=public"},"devDependencies":{"style-dictionary":"^3.9.0"},"gitHead":"c925630ca58644d6f9ff45ee4a69f5a21328759f","_id":"@demogar/plaqueta-ds@1.0.4","_nodeVersion":"16.13.2","_npmVersion":"8.1.2","dist":{"integrity":"sha512-DcsYHi1UzkcRdtuuiWMxLmZVcrWAkdIxK7B0af1cBNwhjX6SSskHNS4FmBYf0WKtJAu9frs9qL9oFLv+TeQEqA==","shasum":"af281c75503f99bdc5d9c5c6f63bb1c628ef635a","tarball":"https://registry.npmjs.org/@demogar/plaqueta-ds/-/plaqueta-ds-1.0.4.tgz","fileCount":19,"unpackedSize":93050,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDxFIWmD2woD0MTESqQzN1rN3MR+fb1XwkaezFcVZc9fAIgGHtRTyyu7zidgfNzW7PxpfOpidWPvKJmOYzHDAyWBd4="}]},"_npmUser":{"name":"demogar","email":"me@demogar.com"},"directories":{},"maintainers":[{"name":"demogar","email":"me@demogar.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/plaqueta-ds_1.0.4_1699897619743_0.977644392484206"},"_hasShrinkwrap":false},"1.0.5":{"name":"@demogar/plaqueta-ds","version":"1.0.5","description":"Design System for PlaquetaDS","author":{"name":"Demóstenes García G.","email":"me@demogar.com"},"license":"MIT","main":"build/js/tokens.json","private":false,"scripts":{"build":"style-dictionary build","clean":"style-dictionary clean","watch":"style-dictionary watch","publishpkg":"npm publish --access=public"},"devDependencies":{"style-dictionary":"^3.9.0"},"gitHead":"eaef7c802c140c85287a395f9e6b7ffbca663511","_id":"@demogar/plaqueta-ds@1.0.5","_nodeVersion":"16.13.2","_npmVersion":"8.1.2","dist":{"integrity":"sha512-/1RLsrXYcL39nNyW1KVxMWbNiVJoEAJIpTHZ4pjJgEB3OiP7SSjSG2l3+fzDJGvDzbDP4USFX7shP9bIhvgKbQ==","shasum":"46bdb3ad99025d0a0d7d8f5830f25f08a9a4b84d","tarball":"https://registry.npmjs.org/@demogar/plaqueta-ds/-/plaqueta-ds-1.0.5.tgz","fileCount":19,"unpackedSize":103584,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCgTYNyXJYzcvg56xy8zpPaQ2YgZ9umt80Bph9Wc1GOjAIgWmrcf3QvLS9rDmZAN2pnkWCbKoG7OdI3ZzH4ocWM5nQ="}]},"_npmUser":{"name":"demogar","email":"me@demogar.com"},"directories":{},"maintainers":[{"name":"demogar","email":"me@demogar.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/plaqueta-ds_1.0.5_1699897716514_0.676537636113741"},"_hasShrinkwrap":false},"1.0.6":{"name":"@demogar/plaqueta-ds","version":"1.0.6","description":"Design System for PlaquetaDS","author":{"name":"Demóstenes García G.","email":"me@demogar.com"},"license":"MIT","main":"build/js/tokens.json","private":false,"scripts":{"build":"style-dictionary build","clean":"style-dictionary clean","watch":"style-dictionary watch","publishpkg":"npm publish --access=public"},"devDependencies":{"style-dictionary":"^3.9.0"},"gitHead":"4be1bdb92ab93a9d9bc44e99ff8a6069b218737e","_id":"@demogar/plaqueta-ds@1.0.6","_nodeVersion":"16.13.2","_npmVersion":"8.1.2","dist":{"integrity":"sha512-CtLCpvVDJGzrmvHHbZf+Sp9JMNRBjG6wXnGnp4G6Bm76tEuU9VRcrXsJAFOBBSKCrS0JEa2Jfhdqd4tPGFBf6Q==","shasum":"227818fba7f72512ff12a02a16447ee3849a59c6","tarball":"https://registry.npmjs.org/@demogar/plaqueta-ds/-/plaqueta-ds-1.0.6.tgz","fileCount":19,"unpackedSize":103584,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQD7ZD35zbDGyBTdY8lvXkPTAIIvcghlwrNFcx7lgpBrWAIgbPfnTy0r8uKgAvJW8TPlVkNREKf/bJAxaOXpyPI8dXI="}]},"_npmUser":{"name":"demogar","email":"me@demogar.com"},"directories":{},"maintainers":[{"name":"demogar","email":"me@demogar.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/plaqueta-ds_1.0.6_1699902074369_0.37869557478709015"},"_hasShrinkwrap":false}},"time":{"created":"2023-11-12T16:36:56.768Z","1.0.0":"2023-11-12T16:36:57.052Z","modified":"2023-11-13T19:01:14.674Z","1.0.1":"2023-11-12T16:49:58.433Z","1.0.2":"2023-11-13T17:07:16.353Z","1.0.3":"2023-11-13T17:40:31.642Z","1.0.4":"2023-11-13T17:47:00.005Z","1.0.5":"2023-11-13T17:48:36.714Z","1.0.6":"2023-11-13T19:01:14.519Z"},"maintainers":[{"name":"demogar","email":"me@demogar.com"}],"description":"Design System for PlaquetaDS","author":{"name":"Demóstenes García G.","email":"me@demogar.com"},"license":"MIT","readme":"# PlaquetaDS - Style Dictionary\n\nThis example code is bare-bones to show you what this framework can do. If you have the style-dictionary module installed globally, you can `cd` into this directory and run:\n```bash\nstyle-dictionary build\n```\n\nYou should see something like this output:\n```\nCopying starter files...\n\nSource style dictionary starter files created!\n\nRunning `style-dictionary build` for the first time to generate build artifacts.\n\n\nscss\n✔︎  build/scss/_variables.scss\n\nandroid\n✔︎  build/android/font_dimens.xml\n✔︎  build/android/colors.xml\n\ncompose\n✔︎ build/compose/StyleDictionaryColor.kt\n✔︎ build/compose/StyleDictionarySize.kt\n\nios\n✔︎  build/ios/StyleDictionaryColor.h\n✔︎  build/ios/StyleDictionaryColor.m\n✔︎  build/ios/StyleDictionarySize.h\n✔︎  build/ios/StyleDictionarySize.m\n\nios-swift\n✔︎  build/ios-swift/StyleDictionary.swift\n\nios-swift-separate-enums\n✔︎  build/ios-swift/StyleDictionaryColor.swift\n✔︎  build/ios-swift/StyleDictionarySize.swift\n```\n\nGood for you! You have now built your first style dictionary! Moving on, take a look at what we have built. This should have created a build directory and it should look like this:\n```\n├── README.md\n├── config.json\n├── tokens/\n│   ├── color/\n│       ├── base.json\n│       ├── font.json\n│   ├── size/\n│       ├── font.json\n├── build/\n│   ├── android/\n│      ├── font_dimens.xml\n│      ├── colors.xml\n│   ├── compose/\n│      ├── StyleDictionaryColor.kt\n│      ├── StyleDictionarySize.kt\n│   ├── scss/\n│      ├── _variables.scss\n│   ├── ios/\n│      ├── StyleDictionaryColor.h\n│      ├── StyleDictionaryColor.m\n│      ├── StyleDictionarySize.h\n│      ├── StyleDictionarySize.m\n│   ├── ios-swift/\n│      ├── StyleDictionary.swift\n│      ├── StyleDictionaryColor.swift\n│      ├── StyleDictionarySize.swift\n```\n\nIf you open `config.json` you will see there are 5 platforms defined: scss, android, compose, ios, and ios-swift. Each platform has a transformGroup, buildPath, and files. The buildPath and files of the platform should match up to the files what were built. The files built should look like these:\n\n**Android**\n```xml\n<!-- font_dimens.xml -->\n<resources>\n  <dimen name=\"size_font_small\">12.00sp</dimen>\n  <dimen name=\"size_font_medium\">16.00sp</dimen>\n  <dimen name=\"size_font_large\">32.00sp</dimen>\n  <dimen name=\"size_font_base\">16.00sp</dimen>\n</resources>\n\n<!-- colors.xml -->\n<resources>\n  <color name=\"color_base_gray_light\">#ffcccccc</color>\n  <color name=\"color_base_gray_medium\">#ff999999</color>\n  <color name=\"color_base_gray_dark\">#ff111111</color>\n  <color name=\"color_base_red\">#ffff0000</color>\n  <color name=\"color_base_green\">#ff00ff00</color>\n  <color name=\"color_font_base\">#ffff0000</color>\n  <color name=\"color_font_secondary\">#ff00ff00</color>\n  <color name=\"color_font_tertiary\">#ffcccccc</color>\n</resources>\n```\n\n**Compose**\n```kotlin\nobject StyleDictionaryColor {\n  val colorBaseGrayDark = Color(0xff111111)\n  val colorBaseGrayLight = Color(0xffcccccc)\n  val colorBaseGrayMedium = Color(0xff999999)\n  val colorBaseGreen = Color(0xff00ff00)\n  val colorBaseRed = Color(0xffff0000)\n  val colorFontBase = Color(0xffff0000)\n  val colorFontSecondary = Color(0xff00ff00)\n  val colorFontTertiary = Color(0xffcccccc)\n}\n\nobject StyleDictionarySize {\n  /** the base size of the font */\n  val sizeFontBase = 16.00.sp\n  /** the large size of the font */\n  val sizeFontLarge = 32.00.sp\n  /** the medium size of the font */\n  val sizeFontMedium = 16.00.sp\n  /** the small size of the font */\n  val sizeFontSmall = 12.00.sp\n}\n```\n\n**SCSS**\n```scss\n// variables.scss\n$color-base-gray-light: #cccccc;\n$color-base-gray-medium: #999999;\n$color-base-gray-dark: #111111;\n$color-base-red: #ff0000;\n$color-base-green: #00ff00;\n$color-font-base: #ff0000;\n$color-font-secondary: #00ff00;\n$color-font-tertiary: #cccccc;\n$size-font-small: 0.75rem;\n$size-font-medium: 1rem;\n$size-font-large: 2rem;\n$size-font-base: 1rem;\n```\n\n**iOS**\n```objc\n#import \"StyleDictionaryColor.h\"\n\n@implementation StyleDictionaryColor\n\n+ (UIColor *)color:(StyleDictionaryColorName)colorEnum{\n  return [[self values] objectAtIndex:colorEnum];\n}\n\n+ (NSArray *)values {\n  static NSArray* colorArray;\n  static dispatch_once_t onceToken;\n\n  dispatch_once(&onceToken, ^{\n    colorArray = @[\n[UIColor colorWithRed:0.800f green:0.800f blue:0.800f alpha:1.000f],\n[UIColor colorWithRed:0.600f green:0.600f blue:0.600f alpha:1.000f],\n[UIColor colorWithRed:0.067f green:0.067f blue:0.067f alpha:1.000f],\n[UIColor colorWithRed:1.000f green:0.000f blue:0.000f alpha:1.000f],\n[UIColor colorWithRed:0.000f green:1.000f blue:0.000f alpha:1.000f],\n[UIColor colorWithRed:1.000f green:0.000f blue:0.000f alpha:1.000f],\n[UIColor colorWithRed:0.000f green:1.000f blue:0.000f alpha:1.000f],\n[UIColor colorWithRed:0.800f green:0.800f blue:0.800f alpha:1.000f]\n    ];\n  });\n\n  return colorArray;\n}\n\n@end\n```\n\nPretty nifty! This shows a few things happening:\n1. The build system does a deep merge of all the token JSON files defined in the `source` attribute of `config.json`. This allows you to split up the token JSON files however you want. There are 2 JSON files with `color` as the top level key, but they get merged properly.\n1. The build system resolves references to other design tokens. `{size.font.medium.value}` gets resolved properly.\n1. The build system handles references to token values in other files as well as you can see in `tokens/color/font.json`.\n\nNow let's make a change and see how that affects things. Open up `tokens/color/base.json` and change `\"#111111\"` to `\"#000000\"`. After you make that change, save the file and re-run the build command `style-dictionary build`. Open up the build files and take a look.\n\n**Huzzah!**\n\nNow go forth and create! Take a look at all the built-in [transforms](https://amzn.github.io/style-dictionary/#/transforms?id=pre-defined-transforms) and [formats](https://amzn.github.io/style-dictionary/#/formats?id=pre-defined-formats).\n","readmeFilename":"README.md"}