Merge pull request #489 from natura-cosmeticos/DSY-4348

Dsy 4348 - filter remove Primitive Colors and added tokens Components
natura-cosmeticos · Apr 4, 2024 · 55c7de1 · 55c7de1
2 parents 88b724c + d90f70b
commit 55c7de1
Show file tree

Hide file tree

Showing 6 changed files with 61 additions and 8 deletions.
diff --git a/packages/natds-themes/config/android/buildAndroidConfig.js b/packages/natds-themes/config/android/buildAndroidConfig.js
@@ -1,4 +1,4 @@
-import { capitalizeWord, camelToSnakeCase } from '../shared/helpers'
+import { capitalizeWord, camelToSnakeCase, excludePrimitiveTokens } from '../shared/helpers'
 import { filterPrivateAndFontFamilyProps, filterSearchAndFontFamilyProps } from './helpers/helpers'
 
 export const buildAndroidConfig = (brand, mode) => {
@@ -16,7 +16,7 @@ export const buildAndroidConfig = (brand, mode) => {
       {
         brandName: capitalizeWord(brand),
         destination: `theme/theme_${brandName}_${mode}_ssot.xml`,
-        filter: filterPrivateAndFontFamilyProps,
+        filter: (token) => excludePrimitiveTokens(token) && filterPrivateAndFontFamilyProps,
         format: 'android/themes',
         mode: capitalizeWord(mode)
       },

diff --git a/packages/natds-themes/config/ios/buildIosConfig.js b/packages/natds-themes/config/ios/buildIosConfig.js
@@ -1,4 +1,4 @@
-import { capitalizeWord, snakeToCamelCase } from '../shared/helpers'
+import { capitalizeWord, snakeToCamelCase, excludePrimitiveTokens } from '../shared/helpers'
 
 const buildIosConfig = (brand, mode) => {
   const brandFormated = capitalizeWord(snakeToCamelCase(brand))
@@ -11,13 +11,13 @@ const buildIosConfig = (brand, mode) => {
     files: [
       {
         destination: `theme/${brandFormated}/${fileName}Theme.swift`,
-        filter: 'privateProperties',
+        filter: (token) => excludePrimitiveTokens(token) && 'privateProperties',
         format: 'ios-swift/theme.swift',
         themeName: fileName
       },
       {
         destination: 'theme/ThemeProtocol.swift',
-        filter: 'privateProperties',
+        filter: (token) => excludePrimitiveTokens(token) && 'privateProperties',
         format: 'ios-swift/theme-protocol.swift'
       },
       {

diff --git a/packages/natds-themes/config/react-native/buildReactNativeConfig.js b/packages/natds-themes/config/react-native/buildReactNativeConfig.js
@@ -1,10 +1,12 @@
+import { excludePrimitiveTokens } from '../shared/helpers'
+
 const buildReactNativeConfig = (brand, mode) => ({
   actions: ['create_type_definitions', 'custom_copy_assets'],
   buildPath: 'build/react-native/',
   files: [
     {
       destination: `${brand}/${mode}.json`,
-      filter: 'privateProperties',
+      filter: (token) => excludePrimitiveTokens(token) && 'privateProperties',
       format: 'json/nested'
     },
     {

diff --git a/packages/natds-themes/config/shared/filters/registerTokenSearchPropertiesFilter.js b/packages/natds-themes/config/shared/filters/registerTokenSearchPropertiesFilter.js
@@ -4,6 +4,28 @@ const tokenCategories = [
   'typography',
   'borderRadius',
   'color',
+  'alert',
+  'appBarTop',
+  'avatar',
+  'badge',
+  'button',
+  'card',
+  'checkbox',
+  'counter',
+  'dialog',
+  'divider',
+  'expansionPanel',
+  'iconButton',
+  'image',
+  'link',
+  'navigationDrawer',
+  'progressIndicator',
+  'radioButton',
+  'shortcut',
+  'snackbar',
+  'tab',
+  'tag',
+  'textField',
   'elevation',
   'opacity',
   'asset'

diff --git a/packages/natds-themes/config/shared/helpers/helpers.js b/packages/natds-themes/config/shared/helpers/helpers.js
@@ -1,3 +1,4 @@
+/* eslint-disable max-len */
 import fs from 'fs'
 import path from 'path'
 import {
@@ -36,6 +37,32 @@ export const hasAlpha = (value) => value.length === 9
 export const isFontFamilyProp = isProp('fontFamily')
 export const checkDir = (dir) => !fs.existsSync(dir) && fs.mkdirSync(dir, { recursive: true })
 
+const removeTokens = [
+  'colorPrimitiveLightGray50',
+  'colorPrimitiveLightGray100',
+  'colorPrimitiveLightGray200',
+  'colorPrimitiveLightGray300',
+  'colorPrimitiveLightGray400',
+  'colorPrimitiveLightGray600',
+  'colorPrimitiveLightGray700',
+  'colorPrimitiveLightGray800',
+  'colorPrimitiveLightGray900',
+  'colorPrimitiveDarkGray50',
+  'colorPrimitiveDarkGray100',
+  'colorPrimitiveDarkGray200',
+  'colorPrimitiveDarkGray300',
+  'colorPrimitiveDarkGray400',
+  'colorPrimitiveDarkGray500',
+  'colorPrimitiveDarkGray600',
+  'colorPrimitiveDarkGray700',
+  'colorPrimitiveDarkGray800',
+  'colorPrimitiveDarkGray900',
+  'colorPrimitiveBlack',
+  'colorPrimitiveWhite'
+]
+
+export const excludePrimitiveTokens = (token) => !removeTokens.some((excludeItem) => token.name.includes(excludeItem))
+
 export const isLogoAssetFileLanguage = (token) => token.attributes.state === 'file' || token.attributes.state === 'pt' || token.attributes.state === 'es'
 export function snakeToCamelCase(str) {
   return str.replace(/[^a-zA-Z0-9]+(.)/g, (m, chr) => chr.toUpperCase())

diff --git a/packages/natds-themes/config/web/buildWebConfig.js b/packages/natds-themes/config/web/buildWebConfig.js
@@ -1,3 +1,5 @@
+import { excludePrimitiveTokens } from '../shared/helpers'
+
 export const buildWebConfig = (brand, mode) => ({
   actions: ['create_type_definitions', 'custom_copy_assets', 'create_type_face'],
   brand,
@@ -11,13 +13,13 @@ export const buildWebConfig = (brand, mode) => ({
     },
     {
       destination: `${brand}/${mode}.json`,
-      filter: 'privateProperties',
+      filter: (token) => excludePrimitiveTokens(token) && 'privateProperties',
       format: 'json/nested',
       options: { showFileHeader: false }
     },
     {
       destination: `${brand}/${mode}.js`,
-      filter: 'privateProperties',
+      filter: (token) => excludePrimitiveTokens(token) && 'privateProperties',
       format: 'javascript/es6',
       options: { showFileHeader: false }
     },